快捷導(dǎo)航

一款jquery特效編寫的大度寬屏焦點(diǎn)圖切換特效的實(shí)例代碼

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

焦點(diǎn)圖顯示區(qū)域有固定的寬度,當(dāng)前顯示寬度之外是一個(gè)半透明層顯示的其它的焦點(diǎn)圖片，最好的是，此特效兼容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動(dòng)畫效果學(xué)習(xí)筆記（8種效果）
這篇文章分享了一份jquery動(dòng)畫效果學(xué)習(xí)筆記，針對jquery動(dòng)畫效果進(jìn)行細(xì)致解析，對淡入淡出效果、滑動(dòng)效果進(jìn)行原理講解，想要學(xué)好jquery動(dòng)畫效果，就耐心閱讀本文，相信大家會(huì)有意想不到的收獲。
2015-11-11
jQuery Mobile中的button按鈕組件基礎(chǔ)使用教程
jQuery Mobile中的button默認(rèn)提供了很多用于制作移動(dòng)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)前元素進(jìn)行下一步的遍歷
通過jQuery方法選中了元素，如何基于這些已經(jīng)選中的元素進(jìn)行下一步的遍歷呢？下面有個(gè)不錯(cuò)的示例，大家可以參考下
2014-05-05
jquery幻燈片插件bxslider樣式改進(jìn)實(shí)例
這篇文章主要介紹了jquery幻燈片插件bxslider樣式改進(jìn),對比官方樣式以實(shí)例形式講述了改進(jìn)的技巧,非常實(shí)用,需要的朋友可以參考下
2014-10-10
jquery中ajax函數(shù)執(zhí)行順序問題之如何設(shè)置同步
這篇文章主要介紹了jquery中ajax函數(shù)執(zhí)行順序問題之如何設(shè)置同步,需要的朋友可以參考下
2014-02-02
Jquery實(shí)現(xiàn)頁面加載時(shí)彈出對話框代碼
將以下代碼置于head標(biāo)簽中即可實(shí)現(xiàn)加載時(shí)彈出對話框的效果，感興趣的朋友可以參考下哈，希望可以幫助到你
2013-04-04
jquery常用技巧及常用方法列表集合
jquery常用技巧及常用方法列表集合，學(xué)習(xí)jquery的朋友可以收藏下。方便查找學(xué)習(xí)。
2011-04-04
jQuery中bind()方法用法實(shí)例
這篇文章主要介紹了jQuery中bind()方法用法,實(shí)例分析了bind()方法的功能、定義及為匹配元素的特定事件綁定事件處理方法的技巧,需要的朋友可以參考下
2015-01-01