鼠标背景颜色鼠标点击后变成红色,随着点击下一个框的时候跟着变化到下一个框的背景! 20
<styletype="text/css">.dha{background:#FFFFCC;width:50px;height:30px;display:block;te...
<style type="text/css">.dh a{ background:#FFFFCC; width:50px; height:30px; display:block; text-align:center; color:#000000;}.dh a:hover{ background:#FF0000;}</style></head><body><div> <div class="dh"><a href="#">导航1</a></div> <div class="dh"><a href="#">导航2</a></div> <div class="dh"><a href="#">导航3</a></div> <div class="dh"><a href="#">导航4</a></div> <div class="dh"><a href="#">导航5</a></div></div><script type="text/javascript">$(function(){ $(".dh a").click(function(){ $(".dh a").removeAttr("style"); $(this).attr("style","background:#FF0000;"); })})</script>这个代码能实现鼠标移上去是这个框的背景颜色是红色,我想实现点击后这个框的背景颜色也变成颜色,点击下一个的时候就是下一个颜色变成红色,其他的还是默认色,是随着鼠标点击而变化背景色?求高手帮忙解决一下,谢谢了
展开
1个回答
展开全部
写通用jquery
//动态改变颜色
var color=new Array('#e3e3e3','#e4e4e4','red','blue');//定义背景颜色,也可以采用动态生成颜色代码
//循环改变a的背景颜色
$('.dh a').each(function(index){
$(this).css('background-color',color[index]);
})
//改变颜色的话也是一样的情况,先循环获得所有a标签的颜色代码,然后循环颜色数组.比较如果不一样就改变颜色
//固定颜色
<a href="javascript:void(0)" onmouse="showColor()"></a>
function showColor(){
$(this).css('background-color','red');
}
你说的我不是很能理解,你看看是不是这么个效果.
上面这是固定的写法
追问
就是点击比如导航栏里“导航1”是它的背景变成红色,点击“导航2”它就变成红色,点击哪个哪个的背景就改变!你在我那个代码上加上这个语句实现这个功能!
追答
代码就是我2个.你加进去
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询