鼠标移动上去变换背景色

本文介绍了如何使用HTML和JavaScript来实现网页元素的交互样式变化,包括鼠标悬停时更改类名和背景颜色等效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

1.用样式名
注意:是this.className  而不是this.style.className

ContractedBlock.gifExpandedBlockStart.gif代码
<div class="subnavi-bottom">
<ul>
<li onmouseover="this.className='white12b current'" onmouseout="this.className='black12b'" class="black12b">&gt; 公司简介</li>

<li onmouseover="this.className='white12b current'" onmouseout="this.className='black12b'"><a href="#">&gt; 企业荣誉</a></li>
<li onmouseover="this.className='white12b current'" onmouseout="this.className='black12b'"><a href="#">&gt; 组织架构</a></li>
</ul>
</div>

 2.直接用样式

ContractedBlock.gifExpandedBlockStart.gif代码
StringBuilder sb = new StringBuilder();
string str_Sql = "select * from ProductClass where len(ClassRelation)=3";
DataTable DT
= PubAccessHelperFunc.GetDataTable(str_Sql);
if (DT.Rows.Count > 0)
{
for (int i = 0; i < DT.Rows.Count; i++)
{
sb.AppendLine(
"<tr onmouseover=\"this.bgColor='#7AB51E';document.getElementById('img" + i + "').src='images/icon.gif';\" onmouseout=\"this.bgColor='';document.getElementById('img" + i + "').src='images/icon1.gif';\">");
sb.AppendLine(
"<td align=\"center\" ><img src=\"images/icon1.gif\" width=\"4\" height=\"9\" id=\"img"+i+"\" /></td>");
sb.AppendLine(
"<td><a class=\"t\" href=\"Food.aspx?CR="+DT.Rows[i]["ClassRelation"].ToString()+"\">"+DT.Rows[i]["ClassName"].ToString()+"</a>");
sb.AppendLine(
"</td>");
sb.AppendLine(
"</tr>");
}
}
else
{
ltl_Class.Text
= "<center style=\"color:red;\">暂无!</center>";
}

 

ContractedBlock.gifExpandedBlockStart.gif代码
用户名: <input class="username" style="background-

color:black;color:'#FF9933';"
onmouseover="this.style.borderColor='#669999'" onmouseout="this.style.borderColor='#A1BCA3'" maxLength="12" name="username">
&nbsp;密码: <input id="password" class="username1" style="background-

color:black;color:'#FF9933';"
onmouseover="this.style.borderColor='#669999'" onmouseout="this.style.borderColor='#A1BCA3'" type="password"

name
="password"> </td>

onmouseout="this.style.backgroundColor='';"

转载于:https://www.cnblogs.com/TTTT/archive/2010/01/07/1641403.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值