【www.gdgbn.com--jquery】
tab标签切换
网页特效:void(0)" class="cur">tab项1
tab项2
tab项3
tab项4
这是容器1
这是容器2
这是容器3
这是容器4
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var intervalid;
var curli;
$(".nav li a").mouseo教程ver(function(){
curli=$(this);
intervalid=setinterval(onmouseover,250);//鼠标移入的时候有一定的延时才会切换到所在项,防止用户不经意的操作
});
function onmouseover(){
$(".cur-sub-con").removeclass("cur-sub-con");
$(".sub-con").eq($(".nav li a").index(curli)).addclass("cur-sub-con");
$(".cur").removeclass("cur");
curli.addclass("cur");
}
$(".nav li a").mouseout(function(){
clearinterval(intervalid);
});$(".nav li a").click(function(){//鼠标点击也可以切换
clearinterval(intervalid);
$(".cur-sub-con").removeclass("cur-sub-con");
$(".sub-con").eq($(".nav li a").index(curli)).addclass("cur-sub-con");
$(".cur").removeclass("cur");
curli.addclass("cur");
});});
</script>