JQuery添加移除Css样式
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery添加移除Css样式</title>
<script language="javascript" src="jquery-1.2.5.js"></script>
<style type="text/css">
.div{height:20px; margin-top:10px;}
.div1{border:1px solid red;}
.div2{border:1px solid #ccc;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(document).ready(function(){
$("div").addClass("div");//给所有的层都添加div的样式
$("#div1").addClass("div1");//给div1 添加样式div1
$("#div2").addClass("div2");//给div2 添加样式div2
$("#div1").click(function(){
$(this).removeClass("div1");//移除div1的样式
})
$("#div2").click(function(){
$(this).removeClass("div2");//移除div2的样式
})
})
//-->
</SCRIPT>
</head>
<body>
<div id="div1">div1</div>
<div id="div2">div2</div>
</body>
</html>
例二
<script type=”text/javascript”>
$(document).ready(function(){
$(”.cate_box h3″).mouseover(function(){
$(this).addClass(”over”);}).mouseout(function(){
$(this).removeClass(”over”);})
$(”.cate_box h3″).click(function()
{
if($(this).next().css(”display”)==”none”)
{
$(this).next().css(”display”,”block”);
}else{
$(this).next().css(”display”,”none”);
}
})
});
</script>
页:
[1]