bxslider-4在添加圖像時加快速度

我有一個頁面，它通過ajax調用獲取所有內容。我還通過ajax調用了我的滑塊圖像。我設置我的滑塊DIV的全部內容與...的getElem ByID（ '滑塊'）的innerHTML =「DIV ID = 'bxslider'> ...等然後：。bxslider-4在添加圖像時加快速度

var bxSlider = $('.bx-pager2').bxSlider({ 
      mode: 'horizontal',  //'vertical', 
      ticker: true, 
      tickerHover: true, 
      tickerspeed: 50000, 
      infiniteLoop: true, 
      speed: 20000, 
      autoHover: false, 
      minSlides: 4, 
      maxSlides: 4, 
      slideWidth: 150, 
      slideMargin: 10, 
      responsive: true, 
      useCSS: false, 
      startSlide: 0 

     });

的問題是：將新圖像加載到滑塊DIV中後，速度不同，例如將50張圖像加載到滑塊中會使速度提高，從而無法識別圖像上的任何內容。

我試圖在此處實現一個bxslider.reload ），但這會使滑塊加載器出現未知（較長）時間。

有沒有想法？

來源

2013-12-09 user1347985

向我們展示你是如何加載圖像或演示。這裏沒有太多可以繼續。 – isherwood

問題可能在tickerspeed，這個github說最大值應該是5000：https://github.com/wandoledzep/bxslider/issues/133 「// float - 使用1到5000之間的值來確定ticker速度 - 數值越小，速度更快的速度「 – imbask

**速度** ** **速度**以毫秒爲單位？如果s實際值變慢 –

剛剛遇到這個問題我自己雖然這不是一個真正的解決方案，它當然是一個解釋。如果你轉到git並點擊js的第907行，你會看到速度的計算是一個取決於滑塊總水平尺寸的比例。

對我來說，這是非常成問題的，因爲我在一個頁面上運行多個滑塊，每個滑塊都動態地提供不同數量的圖像。我已經操縱了股票的默認行爲，所以它只能繼續盤旋，現在它們都以不同的速度運行，其中一些速度非常快。任何人有任何輸入這個新的信息？

來源

2014-01-16 16:53:25 b3smith13

這似乎可以作爲評論更好...評論可以很長，幷包括鏈接。你確定這是一個答案嗎？ –

如果沒有50點聲望，我似乎無法評論。這似乎是足夠有價值的信息，它應該在頁面上，所以我走的路線:) – b3smith13

這是真的。你不能評論其他人的答案。如果你被刪除，你也可以把它作爲一個新的問題，幷包含回鏈接。但我確實明白你的觀點，@ b3smith13。 –

我已經通過計算滑塊中有多少圖像來解決此問題。我爲每張圖片選擇了5000的速度。

我認爲關於速度的混淆是每個圖像計算的。

HTML：

<ul class="bxslider-ticker"> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
    <li><img src="http://placehold.it/200x150" alt=""></li> 
</ul>

JS：

$(function() { 
    //Count the number of li elements 
    var n = $(".bxslider-ticker li").length; 

    var ticker = $('.bxslider-ticker').bxSlider({ 
    minSlides: 1, 
    maxSlides: 100, 
    slideWidth: 200, 
    slideMargin: 10, 
    ticker: true, 
    mode: 'horizontal', 
    tickerHover: true, 
    //Multiply the number of li elements with 5000 
    speed: 5000*n 
    }); 
});

來源

2014-04-24 11:00:06

感謝分享解決方案 - 節省了很多時間解決問題！ – sean2078

bxslider-4在添加圖像時加快速度

回答

相關問題