一款jquery特效編寫的大度寬屏焦點圖切換特效的實例代碼

更新時間：2013年08月05日 11:04:15 作者：

焦點圖顯示區(qū)域有固定的寬度,當(dāng)前顯示寬度之外是一個半透明層顯示的其它的焦點圖片，最好的是，此特效兼容ie6以及其它瀏覽器。

適用瀏覽器：ie6、ie7、ie8、360、firefox、chrome、safari、opera、傲游、搜狗、世界之窗.
主要代碼如下：

 <script type="text/javascript">
 jquery(".slider .bd li").first().before( jquery(".slider .bd li").last() );
 jquery(".slider").hover(function(){
 jquery(this).find(".arrow").stop(true,true).fadein(300) 
 },function(){ 
 jquery(this).find(".arrow").fadeout(300) }); 
 jquery(".slider").slide(
 { titcell:".hd ul", maincell:".bd ul", effect:"leftloop",autoplay:true, vis:3,autopage:true, trigger:"click"}
 );
 </script>

效果圖如下：

您可能感興趣的文章:

相關(guān)文章

jquery動畫效果學(xué)習(xí)筆記（8種效果）
這篇文章分享了一份jquery動畫效果學(xué)習(xí)筆記，針對jquery動畫效果進行細(xì)致解析，對淡入淡出效果、滑動效果進行原理講解，想要學(xué)好jquery動畫效果，就耐心閱讀本文，相信大家會有意想不到的收獲。
2015-11-11
jQuery Mobile中的button按鈕組件基礎(chǔ)使用教程
jQuery Mobile中的button默認(rèn)提供了很多用于制作移動Web頁面按鈕的屬性,這里我們來整理一下jQuery Mobile中的button按鈕組件基礎(chǔ)使用教程,需要的朋友可以參考下
2016-05-05
JQuery中根據(jù)屬性或?qū)傩灾但@得元素(6種情況獲取方法)
根據(jù)屬性或?qū)傩灾但@得元素本文介紹六種不同的情況獲取方法,有需要的朋友可以參考下
2013-01-01
jquery 學(xué)習(xí)之二屬性(類)
jquery 學(xué)習(xí)之二屬性(類),需要的朋友可以參考下。
2010-11-11
jQuery基于當(dāng)前元素進行下一步的遍歷
通過jQuery方法選中了元素，如何基于這些已經(jīng)選中的元素進行下一步的遍歷呢？下面有個不錯的示例，大家可以參考下
2014-05-05
jquery幻燈片插件bxslider樣式改進實例
這篇文章主要介紹了jquery幻燈片插件bxslider樣式改進,對比官方樣式以實例形式講述了改進的技巧,非常實用,需要的朋友可以參考下
2014-10-10
jquery中ajax函數(shù)執(zhí)行順序問題之如何設(shè)置同步
這篇文章主要介紹了jquery中ajax函數(shù)執(zhí)行順序問題之如何設(shè)置同步,需要的朋友可以參考下
2014-02-02
Jquery實現(xiàn)頁面加載時彈出對話框代碼
將以下代碼置于head標(biāo)簽中即可實現(xiàn)加載時彈出對話框的效果，感興趣的朋友可以參考下哈，希望可以幫助到你
2013-04-04
jquery常用技巧及常用方法列表集合
jquery常用技巧及常用方法列表集合，學(xué)習(xí)jquery的朋友可以收藏下。方便查找學(xué)習(xí)。
2011-04-04
jQuery中bind()方法用法實例
這篇文章主要介紹了jQuery中bind()方法用法,實例分析了bind()方法的功能、定義及為匹配元素的特定事件綁定事件處理方法的技巧,需要的朋友可以參考下
2015-01-01