jquery花式圖片庫——jqFancyTransitions

http://www.html580.com/3785javascript

https://yq.aliyun.com/ziliao/4390html

 

使用方法
調用插件js文件:html5

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jqFancyTransitions.js" type="text/javascript"></script>
插件HTML代碼結構:
<div id='slideshowHolder'>
       <img src='img1.jpg' alt='img1' />
       <img src='img2.jpg' alt='img2' />
       <img src='img3.jpg' alt='img3' />
</div>
插件啓用代碼:
<script>
    $(document).ready( function(){
        $('#slideshowHolder').jqFancyTransitions({ width: 400, height: 300 });
    });
</script>java

參數說明
effect    效果選擇:默認''(wave, zipper, curtain)
width    寬度:默認500
height    高度:默認320t
strips    圖片分解條數:默認20
delay    輪播時間:默認5000ms
stripDelay    條數動畫時間:默認50(越大越慢)
titleOpacity    標題透明度:默認0.7
titleSpeed    標題變化速度:默認1000
position    動畫效果:默認alternate(top, bottom, alternate, curtain)
direction    動畫方向:默認fountainAlternate(left, right, alternate, random, fountain, fountainAlternate)
navigation    是否顯示導航:默認false
links    圖片是否帶鏈接:默認falsejquery

相關文章
相關標籤/搜索