本篇內容主要講解“jQuery怎么實現翻牌或百葉窗效果”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“jQuery怎么實現翻牌或百葉窗效果”吧!
效果預覽:

動態效果請進入:http://www.cnblogs.com/lufy/archive/2012/06/07/2539744.html觀看
$(function(){ var timer = true; //執行向上或向下的開關 var liindex = 0; //LI的索引 var $div = $(".byc").find("div"); //每隔三秒執行一次變換LI的內容 var set1 = setInterval(function(){ ainbyc($div); liindex = 0; timer = !timer; },3000); //LI變換的方式,即每隔100ms,讓下一個LI移動top值; function ainbyc(ds){ var set2 = setInterval(function(){ //所有的LI移動完畢,就清除 if(liindex == $div.length){ clearInterval(set2); //向上 }else if(timer){ ds.eq(liindex).animate({"top":0},100); //向下 }else{ ds.eq(liindex).animate({"top":-25},100); } liindex++; },100); } })1.清除定時器clearInterval,先前我寫在了外面,應該是寫在setInterval里面。
2.當不確定布爾是什么值的時候,可以這樣寫:timer = !timer;
到此,相信大家對“jQuery怎么實現翻牌或百葉窗效果”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。