search

Home >Web Front-end >HTML Tutorial >I would like to ask for advice on the discoloration problem of js and css combined with the table mouse_html/css_WEB-ITnose

I would like to ask for advice on the discoloration problem of js and css combined with the table mouse_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:02:571077browse

I found some information from the Internet today. js and css are combined with the table mouse to change color, and the table changes color every other row. However, there is a problem in the code, which is very serious. After adding these codes, all the tables on the page are affected. How to modify the CSS code so that the style is only used for the bb table and not for other tables. Experts can help me, how can I modify the code under guidance? 

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">#bb th,td{text-align:left;padding:.5em;border:1px solid #fff;}#bb th{background-color:#328aa4;color:#fff;}td{background:#e5f1f4;}tr.even td{background:#e5f1f4;}tr.odd td{background:#f8fbfc;}tr.over td{background:#bce774;}tr.out td{}</style></head><script type="text/javascript">function changeTableBg(){	if(document.getElementById("bb")== null)	{		return false;	}	var changeTr=document.getElementById("bb").getElementsByTagName("tr");    for(i=0;i<changeTr.length;i++)    {		changeTr[i].className=(i%2>0)?"even":"odd";	    changeTr[i].temp=changeTr[i].className;	    changeTr[i].onmouseover=function()		{	             this.className='over';        	    }		changeTr[i].onmouseout=function()		{	             this.className=this.temp;        		}    }}</script><body onLoad="changeTableBg()">......


Reply to discussion (solution)

#bb td{background:#e5f1f4;}#bb tr.even td{background:#e5f1f4;}#bb tr.odd td{background:#f8fbfc;}#bb tr.over td{background:#bce774;}#bb tr.out td{}

Thank you for your advice

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：Bloglines Subscribe to Blog Blog RSS Network ExcerptNext article：Bloglines Subscribe to Blog Blog RSS Network Excerpt

Related articles

See more