2012-07-01 2 views
0

각 셀마다 다른 색상이있는 표를 원하며, 마우스를 가리킬 때 지정된 색상으로 변경되며 텍스트 색상에는 영향을 미치지 않습니다. 자바 스크립트없이 가능합니까? 다른 색상으로 세 개의 셀이
내 간단한 테이블 셀의에 영향을주지해야 텍스트 색상을 Rederring텍스트 색상을 적용하지 않고 마우스를 움직일 때 셀 색상이 변경됩니다.

<table> 
<tr> 
<td bgcolor="red">Red</td> 
<td bgcolor="blue">Blue</td> 
<td bgcolor="green">Green</td> 
</tr> 
</table> 

있습니다. 나는 간단한 스크립트로 이것을 원한다.

답변

0

뭔가 같은 :

<style type="text/css"> 
     .td_hover { background-color: white; } 
     .td_hover:hover { background-color: yellow; } 
     .bg_red { background-color: red; } 
     .bg_blue { background-color: blue; } 
     .bg_green { background-color: green; } 
</style> 
<table> 
    <tr> 
     <td class="td_hover bg_red">Red</td> 
     <td class="td_hover bg_blue">Blue</td> 
     <td class="td_hover bg_greed">Green</td> 
    </tr> 
</table> 
+0

목 anks 남자 이것은 이것을하는 가장 간단한 방법 중 하나입니다! –

+0

당신은 환영합니다! –

0

예, 십 년간 오래된 bgcolor 속성 대신 CSS를 사용합니다.

0

클래스를 추가하고 (예 : "tablecell") bgcolor를 제거하십시오.

CSS-방법 :

.tablecell:hover { 
    background-color:#000000; // Put color you want it to be on hover here. 
} 
.tablecell { 
    background-color:#FF0000; // Put color you wan tit to be on not-hover here (optional) 
} 

자바 스크립트 방법 :

myElement.addEventListener("onmouseover", mouseIn); 
myElement.addEventListener("onmouseout", mouseOut); 

function mouseIn() { 
    this.style.backgroundColor = "#000000"; 
} 

function mouseOut() { 
    this.style.backgroundColor = "#FF0000"; 
} 

의 jQuery 방법 :

$(".tablecell").on("hover", mouseIn, mouseOut); // functions above 
관련 문제