jquery 的3D Carousel插件参数说明
生活随笔
收集整理的這篇文章主要介紹了
jquery 的3D Carousel插件参数说明
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
?
這個插件大家都很熟悉了,但是在網上找了很久找不到相關的資料,只有自己琢磨研究了一下。有些參數一眼都可以看出意思,在此我只說一下每個圖片要想帶一些擴展信息怎么處理。
1:首先需要創建一個ul對象,然后里面每一個li對象中的內容就是一個旋轉的圖形,第一個需要注意的就是img對象必須放在最前面,然后后面才跟其他內容。
<li><img src="images/content1.png" alt=""/><div class="tooltip">提示信息</div><data class="url">Real.aspx</data><data class="linkTarget">_self</data> </li>
如上所寫,img是選擇的圖片,tooltip是鼠標移動到圖片上的提示信息,后面兩個data節點的內容是我需要自定義的內容,請注意這里面必須定義class,然后在后面要使用該值時就使用class名稱的屬性名。
2:創建一個carousel對象
$("#carousel").carousel({width: 400, //對象寬度 height: 200, //對象高度itemWidth: 20,posterWidth: 340, //當前顯示的圖片的寬度posterHeight: 200, //當前顯示的圖片的高度horizontalRadius: 370, //圖片左右滾動的半徑verticalRadius: 100, //圖片上下滾動的半徑resize: false,mouseScroll: false,mouseDrag: true,scaleRatio: 0.4,scrollbar: false,autoScroll: true,tooltip: true,itemClick: onItemClick, //自定義每個圖片的點擊事件mouseWheel: true,mouseWheelReverse: true});
3:選擇圖片點擊事件說明
function onItemClick(evt) {window.location.href = evt.data.url;}
在此特別說明:點擊事件輸入的evt對象,evt.data就是可以自定義的數據, 該控件默認有屬性名:path,link,linkTarget,tooltip。屬性名就是class名稱,在火狐或chrome中定義了link和linkTarget屬性,會自動彈出鏈接窗口。但是在IE8中沒有。因此,我自定義了一個url的地址。在Click事件中進行自行處理。
轉載于:https://www.cnblogs.com/coolsundy/p/5888327.html
總結
以上是生活随笔為你收集整理的jquery 的3D Carousel插件参数说明的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: b超检查多少钱啊?
- 下一篇: 谁现在有霹雳mit百度云资源,求,,谢谢