jquery實現(xiàn)div陰影效果示例代碼
更新時間：2013年09月16日 11:47:00 作者：
div陰影效果在以前都是采用圖片來實現(xiàn)的，而在本文大家將學(xué)會使用jquery來實現(xiàn)，感興趣的朋友可以參考下
復(fù)制代碼 代碼如下:
<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" class="mydiv1" onmouseover="changediv('t');" onmouseout="changediv('f');">
contents
</div>
</body>
</html>
相關(guān)文章
jQuery修改li下的樣式以及l(fā)i下的img的src的值的方法
這篇文章主要為大家介紹了jQuery如何修改li下的樣式，以及修改li下的img的src的值，示例代碼很簡單，一看就會2014-11-11
這篇文章介紹了jQuery遍歷節(jié)點元素的方法，文中通過示例代碼介紹的非常詳細。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-03-03
本文主要介紹了用的jqueryRotate插件實現(xiàn)轉(zhuǎn)盤抽獎功能的方法，具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
這篇文章主要為大家詳細介紹了jQuery UI制作選項卡tabs的方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
這篇文章主要介紹了jquery文檔操作wrap()方法,以實例形式簡單分析了wrap()方法用某個標(biāo)簽將某個元素包起來的使用技巧,需要的朋友可以參考下2015-01-01
jQuery判斷checkbox(復(fù)選框)是否被選中以及全選、反選實現(xiàn)代碼
本篇文章主要是對jQuery判斷checkbox(復(fù)選框)是否被選中以及全選、反選實現(xiàn)代碼進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
jQuery建立一個按字母順序排列的友好頁面索引(兼容IE6/7/8)
很多人熟悉使用錨鏈接跳轉(zhuǎn)到的頁面部分的解決方案,這種效果當(dāng)需要列出很長的數(shù)據(jù)集時，是非常實用的,然而頁面跳轉(zhuǎn)對于游客來說有時候并不是好友好，弊端我就不多說了，祥看下本文2013-02-02
利用Jquery隊列實現(xiàn)根據(jù)輸入數(shù)量顯示的動畫
這篇文章給大家演示了如何利用Jquery隊列實現(xiàn)輸入不同的數(shù)量就顯示不同的動畫效果，文中給出了實例，讓大家更容易理解，有需要的可以參考借鑒。2016-09-09
這篇文章主要介紹了jQuery的text()方法用法,以實例形式詳細分析了jQuery的text()方法的定義、參數(shù)與具體用法,具有一定的參考借鑒價值,需要的朋友可以參考下2014-12-12
大家都知道dom是一種與瀏覽器、平臺、語言無關(guān)的接口，使用dom接口可以很輕松訪問頁面中所有的標(biāo)準(zhǔn)組件，本篇文章主要給大家講解jquery基礎(chǔ)教程之dom操作，有需要的朋友可以參考下2015-08-08