手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jquery实现div阴影效果示例代码
jquery实现div阴影效果示例代码
摘要:复制代码代码如下:.mydiv1{height:250px;width:250px;border:#9090901pxsolid;}.myd...

复制代码 代码如下:

<html>

<head>

<style>

.mydiv1 {height:250px;width:250px;border:#909090 1px solid;}

.mydiv2 {

width:250px;height:250;border:#909090 1px solid;background:#fff;color:#333;

filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/

-moz-box-shadow: 2px 2px 10px #909090;/*firefox*/

-webkit-box-shadow: 2px 2px 10px #909090;/*safari或chrome*/

box-shadow:2px 2px 0px #909090;/*opera或ie9*/

}

</style>

<script>

function changediv(v){

var d = document.getElementById("mydiv");

if(v == "t") d.className="mydiv2";

else d.className="mydiv1";

}

</script>

</head>

<body>

<div id="mydiv" onmouseover="changediv('t');" onmouseout="changediv('f');">

contents

</div>

</body>

</html>

【jquery实现div阴影效果示例代码】相关文章:

jQuery实现div随意拖动的实例代码(通用代码)

jQuery实现鼠标经过图片变亮其他变暗效果

免费空间广告万能消除代码

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

jQuery实现返回顶部功能

js实现顶部可折叠的菜单工具栏效果实例

jQuery插件pagewalkthrough实现引导页效果

js实现简单div拖拽功能实例

jQuery实现延迟跳转的方法

jQuery实现首页图片淡入淡出效果的方法

精品推荐
分类导航