<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

<title>基于jQuery實(shí)現(xiàn)的點(diǎn)擊圖片翻頁(yè)展示效果</title>

<meta http-equiv="content-type" content="text/html;charset=gb2312">

<style type="text/css">

.div{width:240px;height:90px;z-index:0;position:absolute;left:10px;border:2px #3300FF solid;border:0px;color:#FFFFFF;margin-left:320px;}

</style>

<script type="text/javascript" src="/images/jquery1.3.2.js"></script>

<script type="text/javascript">

$(function(){

 var z=-1;

 $("div").click(function(){

  $(this).animate({left:"350px"},1000,function(){$(this).css("zIndex",z--)}).animate({left:"10px"},1000);

 })

});

</script>

</head>

<body>若不能顯示效果，則刷新頁(yè)面可正常。

<div class="div"><img src="images/m01.jpg"></div>

<div class="div"><img src="images/m02.jpg"></div>

<div class="div"><img src="images/m03.jpg"></div>

<div class="div"><img src="images/m04.jpg"></div>

</body>

</html>

希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法,涉及javascript隨機(jī)數(shù)及動(dòng)態(tài)設(shè)置css樣式的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-07-07
jquery html5 視頻播放控制代碼
這篇文章主要介紹了jquery html5 視頻播放控制代碼,需要的朋友可以參考下
2016-11-11
jquery實(shí)現(xiàn)select選擇框內(nèi)容左右移動(dòng)代碼分享
這篇文章主要介紹了jquery實(shí)現(xiàn)select選擇框內(nèi)容左右移動(dòng)代碼，感興趣的小伙伴們可以參考一下
2015-11-11
jquery 圖片上一張下一張鏈接效果（續(xù)篇）
很久沒寫文章了，這段時(shí)間一直在做類似鮮果的一個(gè)應(yīng)用和數(shù)據(jù)采集，還有就是對(duì)企業(yè)和個(gè)人成長(zhǎng)的思考。
2010-04-04
jQuery選擇器中含有空格的使用示例及注意事項(xiàng)
選擇器中的空格是不容忽視的，多一個(gè)空格或少一個(gè)空格也許得到的結(jié)果會(huì)截然不同的，下面以一個(gè)示例為大家詳細(xì)介紹下到底有什么不同，感興趣的朋友額可以參考下
2013-08-08
jQuery中jqGrid分頁(yè)實(shí)現(xiàn)代碼
今天看到j(luò)avaeye上有人使用了jqGrid實(shí)現(xiàn)了數(shù)據(jù)的分頁(yè)，參考它的代碼，實(shí)現(xiàn)了這個(gè)功能，搬出來曬曬，作為自己以后學(xué)習(xí)的資料
2011-11-11
jQuery代碼性能優(yōu)化的10種方法
之前，我們減少字節(jié)數(shù)和請(qǐng)求次數(shù)以及加載順序以使頁(yè)面加載的更快。如今，我們?cè)絹碓蕉嗟淖⒁獾搅硪粋€(gè)影響網(wǎng)站性能的部分--CPU利用率。使用 jQuery和其他JavaScript框架，使節(jié)點(diǎn)選擇和DOM操作變得越來越容易，如果使用不當(dāng)，有可能影響整個(gè)網(wǎng)頁(yè)的響應(yīng)速度。
2016-06-06
基于JQuery的模擬蘋果桌面Dock效果(穩(wěn)定版)
之所以將它命名為穩(wěn)定版，是因?yàn)橹耙呀?jīng)分享了一個(gè)初級(jí)版本的，之前的初級(jí)版中存在很多bug?，F(xiàn)在經(jīng)過反復(fù)琢磨、實(shí)驗(yàn)，修復(fù)了之前版本存在的很多不足之處，就算鼠標(biāo)快速的滑動(dòng)依然表現(xiàn)的很穩(wěn)定
2012-10-10
jquery select多選框的左右移動(dòng) 具體實(shí)現(xiàn)代碼
這篇文章介紹了jquery實(shí)現(xiàn)select多選框的左右移動(dòng)的方法，有需要的朋友可以參考一下
2013-07-07
基于jQuery下拉選擇框插件支持單選多選功能代碼
這篇文章主要介紹了基于jQuery下拉選擇框插件支持單選多選功能代碼的相關(guān)資料,需要的朋友可以參考下
2016-06-06