jquery實現的具有漸變效果的圖片切換
本章節分享一段代碼實例，實現了圖片的切換效果，這里不管是背景圖片還是其他什么樣的切換效果。總之具有漸變效果的切換更為柔和，當然用戶使用起來也更加人性化，下面就是一段具有此特性的代碼。
代碼實例:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("ul.gallery li").hover(function() {
var thumbOver = $(this).find("img").attr("src");
$(this).find("a.thumb").css({'background' : 'url(' + thumbOver + ') no-repeat center bottom'});
$(this).find("span").stop().fadeTo('normal', 0 , function() {
$(this).hide()
});
} , function(){
$(this).find("span").stop().fadeTo('normal', 1).show();
});
});
</script>
</head>
<body>
<ul class="gallery">
<li>
<a href="#" class="thumb"><span><img src="map.jpg" alt=""></span></a>
<h2><a href="#">Sunflowa Media</a></h2>
</li>
</ul>
</body>
</html>
聲明：本文內容由互聯網用戶自發貢獻，該文觀點僅代表作者本人。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。如發現本站有涉嫌抄襲侵權/違法違規的內容， 請發送郵件至201542412@QQ.com舉報，一經查實，本站將立刻刪除。
相關推薦
-
jQuery 動畫效果代碼實例
本章節分享一段代碼實例，它使用jqury實現了簡單的動畫效果。代碼非常的簡單，比較適合初學者參考學習之用。代碼實例如下: chrs
-
jQuery實現的生成隨機密碼代碼實例簡單介紹
本章節介紹一下如何使用jQury實現生成隨機密碼的效果。有需要的朋友可以做一下參考，代碼實例如下:
-
拖動滾動條實現網頁內容自動加載代碼實例
本章節分享一段代碼實例，它實現了向下拖動滾動條，能夠自動加載網頁內容的功能。這種效果在很多網站都有應用，當然它們加載的內容都是從數據庫讀取的，下面的演示自然不能從數據庫讀取內容，不過原理大致如此，實際
-
js解析xml文件簡單代碼實例
下面分享兩個代碼片段，它們都實現了對XML文件的解析效果。（1）.原生jvscrit:vr xmlDoc = rqust.rsonsXML;try // Build Mrkrs,
-
jquery判斷<img>圖片是否加載完成代碼實例
使用jqury實現此功能非常的簡單，直接看代碼實例:$(function(){ $(.ntzon).ch(function() { $(this).lod(function(){
