手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery实现鼠标滑过Div层背景变颜色的方法
jQuery实现鼠标滑过Div层背景变颜色的方法
摘要:本文实例讲述了jQuery实现鼠标滑过Div层背景变颜色的方法。分享给大家供大家参考。具体实现方法如下:复制代码代码如下:jQuery实现感...

本文实例讲述了jQuery实现鼠标滑过Div层背景变颜色的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:<html>

<head>

<title>jQuery实现感应鼠标经过Div层变换图层背景颜色)</title>

<style type="text/css">

.divbox{

height:300px;

width:200px;

background:#ffffff;

border:solid 1px #ccc;

float:left;

margin-right:10px;

}

.divOver{

background:#eff8fe;

border:solid 1px #d2dce3;

}

#zztj{color:#ffffff;}

#zztj a,#zztj a:link,#zztj a:visited,#zztj a:active {color:#ffffff;}

#zztj a:hover {color:#ffffff;}

</style>

<script src="http://www.jb51.netimages/jquery.js"></script>

<script language="javascript">

$(function(){

//当鼠标滑入时将div的class换成divOver

$('.divbox').hover(function(){

$(this).addClass('divOver');

},function(){

//鼠标离开时移除divOver样式

$(this).removeClass('divOver');

}

);

});

</script>

</head>

<body>

<div id="menu">

<div>区块A</div>

<div>区块B</div>

<div>区块C</div>

</div><br>提示:如果不显示预览效果,请<font color=red>刷新一下本页面</font>,因调用了远程的jquery插件,需要加载完成才能运行。

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

【jQuery实现鼠标滑过Div层背景变颜色的方法】相关文章:

JavaScript实现表格点击排序的方法

javascript用函数实现对象的方法

jQuery实现延迟跳转的方法

js实现鼠标划过给div加透明度的方法

jQuery实现文本展开收缩特效

javascript实现Table排序的方法

jQuery插件bgStretcher.js实现全屏背景特效

jQuery实现返回顶部效果的方法

JQuery实现动态添加删除评论的方法

javascript实现行拖动的方法

精品推荐
分类导航