jQuery插件Elastislide實現(xiàn)響應(yīng)式的焦點圖無縫滾動切換特效
更新時間：2015年04月12日 16:36:21 投稿：hebedich
這篇文章主要介紹了jQuery插件Elastislide實現(xiàn)響應(yīng)式的焦點圖無縫滾動切換特效,效果非常的棒，而且兼容性也很好，推薦給小伙伴們
支持響應(yīng)式的jQuery焦點圖片無縫滾動切換特效插件Elastislide，非常漂亮的圖片輪播特效插件，支持左右輪播圖片、上下輪播圖片、自適應(yīng)移動端顯示，支持眾多的參數(shù)配置：orientation :'horizontal'(水平切換),speed : 500(切換速度,單位毫秒),easing : 'ease-in-out'(動畫效果), minItems : 3(默認展示的數(shù)量)等,瀏覽器兼容方面：IE8+、以及較現(xiàn)代瀏覽器，不介意低版本瀏覽器的可以使用，當然也可以使用到移動端觸屏。
支持響應(yīng)式的jQuery焦點圖片無縫滾動切換特效插件Elastislide
使用方法：
1.加載jQuery和插件
<script type="text/javascript" src="libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquerypp.custom.js"></script> <script type="text/javascript" src="js/jquery.elastislide.js"></script> <link rel="stylesheet" type="text/css" href="css/elastislide.css" />
2.HTML內(nèi)容
<ul id="carousel" class="elastislide-list"> <li><a href="#"><img src="images/small/1.jpg" alt="image01" /></a></li> <li><a href="#"><img src="images/small/2.jpg" alt="image02" /></a></li> <li><a href="#"><img src="images/small/3.jpg" alt="image03" /></a></li> <li><a href="#"><img src="images/small/4.jpg" alt="image04" /></a></li> <li><a href="#"><img src="images/small/5.jpg" alt="image05" /></a></li> <li><a href="#"><img src="images/small/6.jpg" alt="image06" /></a></li> </ul>
3.函數(shù)調(diào)用
<script type="text/javascript">
$(document).ready(function() {
$( '#carousel' ).elastislide();
});
</script>
以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡。
相關(guān)文章
在Discuz! 6.1中無法直接使用jQuery，此時對/include/javascript/common.js文件應(yīng)用如下補丁即可。2008-09-09
這篇文章主要介紹了jQuery EasyUI API 中文幫助文檔和擴展實例 的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-08-08
Jquery attr("checked") 返回checked或undefined 獲取選中失效
$('#cb').attr('checked'); 返回的是checked或者是undefined，不是原來的true和false了，有關(guān)此問題的解決方法如下，感興趣的朋友可以參考下2013-10-10
gridster.js是一款基于jquery的前端拖拽插件，效果相當?shù)牟诲e，大家可以先看看Demo(http://gridster.net/#intro)（藍色部分的白塊就是了，可以隨便拖動，娛樂性很強）。2015-04-04
這篇文章主要介紹了jQuery 動畫與停止動畫效果,結(jié)合實例形式詳細分析了jQuery 動畫與停止動畫效果相關(guān)函數(shù)功能、用法及使用注意事項,需要的朋友可以參考下2020-05-05
這篇文章主要介紹了jQuery的$.extend 淺拷貝與深拷貝的相關(guān)資料,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了利用jQuery異步上傳文件的插件用法詳解,需要的朋友可以參考下2017-07-07
這篇文章主要介紹了jQuery如何實現(xiàn)模糊搜索，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-05-05
文本有關(guān)的樣式和jQuery求對象的高寬問題分別說明
有關(guān)文處理本有關(guān)的問題WEB開發(fā)經(jīng)常會用到，這里結(jié)合使用情況總結(jié)一下，同時還有jQuery求對象的高度問題，下面為大家本別講解下2013-08-08
jquery根據(jù)一個值來選中select下的option實例代碼
下面小編就為大家?guī)硪黄猨query根據(jù)一個值來選中select下的option實例代碼。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-08-08