七乐彩图表走势图表

jQuery輪播滾動插件(原創)

所屬分類:媒體,UI-幻燈片和輪播圖,滑塊和旋轉,滾動

 10333  46  查看評論 (18)
分享到微信朋友圈
X
jQuery輪播滾動插件(原創) ie兼容8

更新時間:2019/4/29 上午9:17:52

更新說明:修改bug,圖片周邊有白邊


更新時間:2019/4/11 下午5:39:06

更新說明:調用方法更新

本插件只需要調節兩個參數

1. speed  可選 滾動時間間隔 默認值3000(即3s)

2. direction 可選  滾動方向 ‘vertical’向上滾動,‘horizantal’向左滾動,默認值'horizantal'

$('.singleScroll').mySingleScroll({speed: 3000,direction:'horizantal'});
//也可以直接初始化
$('.singleScroll').mySingleScroll();

更新時間:2019/4/3 下午3:11:21

更新說明:有幾個朋友留言說切換時有點生硬,希望切換時有緩動效果,特意修改了一下,很感謝大家給的寶貴意見


發布時間:2019-03-19 21:36:10

使用方法

本插件只需要調節兩個參數

1. speed  可選 滾動時間間隔 默認值3000(即3s)

2. 2. direction 可選  滾動方向 ‘vertical’向上滾動,‘horizantal’向左滾動,默認值'horizantal'

$('.singleScroll').singleScroll({
    speed: 3000,
    direction: 'horizantal'
});

也可以直接初始化

$('.singleScroll').singleScroll();
相關插件-幻燈片和輪播圖,滑塊和旋轉,滾動

非全屏輪播banner圖

非全屏輪播banner
  幻燈片和輪播圖
 16708  102

購物網站特色欄目jquery插件

可以隨意設置欄目信息,頂端可以使用四格或者更多圖片來滑動顯示,美觀大方。
  幻燈片和輪播圖
 15257  121

仿UC輪播插件imgSlider.js

js圖片輪播幻燈片制作UC瀏覽器官網焦點圖片切換,通過鼠標點擊縮略圖切換banner大圖,帶左右按鈕控制縮略圖片滾動切換,進行圖片自動輪播
  幻燈片和輪播圖
 12155  90

jQuery個性化數字焦點圖代碼

jQuery個性化數字焦點圖代碼,底部4個焦點數字編碼,左右展開,同時展開文字說明
  幻燈片和輪播圖
 13342  60

討論這個項目(18)回答他人問題或分享插件使用方法獎勵jQ幣

    青澀 0
    2019/4/29 17:30:46
    圖片寬度100%,js在哪里改? 回復
    圖存程序定制工作室 0
    2019/4/18 2:38:52
    鼠標連續點下一張按鈕的時候,后面出來的每張圖片間隔就消失了. 希望老哥看看是什么B U G 手動微笑.感謝
        西瓜0
        2019/4/18 8:51:01
        我認為這不算bug,如果用戶著急查看下一張,每一張還存在時間間隔反而會不好,等的會很累。
        圖存程序定制工作室0
        2019/4/18 10:36:23
        是圖片和圖片之間的間距不是時間間隔. 您連續點下一張每張圖與每張圖的間距就沒了.也不會恢復.
        180301273751
        2019/4/29 9:18:06
        是inline-block引起的元素白邊,已經修改
        180301273750
        2019/4/29 9:19:30
        容器元素的樣式添加一個font-size:0就可以了
    回復
    1448711794 1
    2019/4/16 11:34:57

    希望能改進的地方:

    1.你上一頁下一頁需要重置定時器。

    2.你這個option放init里面,還要opts["speed"] 這樣使用,建議內部全局寫法。

    3.init只是一個單獨的啟動方法,別所有的方法都寫里面,沒有條理。

    4.return返回api的地方,怎么擴展,if|else進行到底?

    5.命名太隨便了。

    舉個例子:

    next.click(function() {
        clearInterval(timers[i]);
        rmove(_this, sh);
        timers[i] = setInterval(function() {
            move(_this, sh);
        }, speed);
    });

    定時器重置,實在不想重構你的代碼了,精力有限。

        180301273750
        2019/4/16 13:22:42
        1.上一頁下一頁重置定時器干嘛,hover進去的時候已經clearInterval?
        3.這個建議挺好的,我已經移出init
        4.if/else需要判斷橫向滾動和豎向滾動
    回復
    1448711794 0
    2019/4/16 10:59:50
    好用,多張輪播很不錯,至于樣式自己寫很簡單,真棒 回復
    鼠?與你 0
    2019/4/15 15:52:28
    可以加一點延遲就更完美了 回復
    qzuser 0
    2019/4/13 22:31:22
    隨便改一下html結構或者給父元素加點屬性 輪播就不生效了。。。
        180301273750
        2019/4/13 23:33:47
        只要沒有修改插件html結構,就不會有問題
    回復
    盤龍 0
    2019/4/13 15:51:56
    怎么下載
        蒲公英失約的夏~0
        2019/4/15 15:19:51
        回答別人問題有Q幣
    回復
    yin.x.f 0
    2019/3/20 9:36:44
    簡單好用,就是切換時有點生硬,加入緩動效果就更好了。 回復
    areyouOk 0
    2019/3/19 21:39:16
    簡單好用,就是切換時有點生硬,加入緩動效果就更好了。
        ??小黏包0
        2019/3/28 17:08:51
        和你一樣
        走失的瓶蓋0
        2019/4/13 11:01:01
        是嗎
    回復
取消回復
  短信接口
七乐彩图表走势图表