菜单怎么实现点击后变色_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 09:26:43
Original
3354 people have browsed it


回复讨论(解决方案)


<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试

.new{color:red;}
如:$('.left li').click(function(){
$('.left li').removeClass('new');
$(this).addClass('new');
})

题主意思是点击后的和没有点击过的区分开颜色不同吧,是需要css那边设置标签下的不同状态颜色不同吧

<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试

点击别的,这个怎么恢复成原先的颜色啊

题主意思是点击后的和没有点击过的区分开颜色不同吧,是需要css那边设置标签下的不同状态颜色不同吧

是的,不知道怎么设置



<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试

点击别的,这个怎么恢复成原先的颜色啊



id用数字,比如:

a1
a2
a3
a4
a5

先把所有的改成原来的颜色,然后把点击的改成新的颜色.你试试,



<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试点击别的,这个怎么恢复成原先的颜色啊

id用数字,比如:

a1
a2
a3
a4
a5

先把所有的改成原来的颜色,然后把点击的改成新的颜色.你试试,
你不会要我一个个写吧




<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试

点击别的,这个怎么恢复成原先的颜色啊



id用数字,比如:

a1
a2
a3
a4
a5

先把所有的改成原来的颜色,然后把点击的改成新的颜色.你试试,






<a href="javascript:void(0)' id="clickindex1" onclick="clickcolor('#clickindex1')" >改变颜色</a>
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login



function clickcolor(idclick){//必须先导入jquery的类库.//jquery可以实现.$(idclick).css("background-color", "red");//改变颜色}
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login
Copy after login


试试

点击别的,这个怎么恢复成原先的颜色啊



id用数字,比如:

a1
a2
a3
a4
a5

先把所有的改成原来的颜色,然后把点击的改成新的颜色.你试试,

<!DOCTYPE HTML><head><title>数据</title><meta characterset="utf-8" /><script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js" ></script></head><body><header>	<nav>		<ul>			<li><a href="javascript:void(0)" id="a1" onclick="chcolor(1)">首页</a></li>			<li><a href="javascript:void(0)" id="a2" onclick="chcolor(2)">添加</a></li>			<li><a href="javascript:void(0)" id="a3" onclick="chcolor(3)">管理</a></li>			<li><a href="javascript:void(0)" id="a4" onclick="chcolor(4)">操作</a></li>			</ul>	<nav></header></body><script type="text/javascript">	function chcolor(ids)	{		for(var i=1;i<5;i++)		{			$("#a"+i).css({"color":"#000","font-size":"14px","background-color":"#fff"});		}		$("#a"+ids).css({"color":"red","font-size":"20px","background-color":"#333"});	}</script></html>
Copy after login


大概是这样的。关于设置css可以去看下jquery的api..

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template