2011-06-28 59 views
1

我在加載動態內容時嘗試更新nivoslider時遇到了一些問題。我需要做的是在通過AJAX調用加載新內容時更新滑塊。Nivoslider更新或重新啓動甚至銷燬

所以基本上我有一個div從函數AJAX調用中獲取新數據,並且在加載後我需要滑塊重新初始化。

我現在做的是這樣的:

if ($('#imageSlider').find('div.nivo-slice').length > 0) { 
    $('#imageSlider').data('nivoslider').stop(); 
    $('#imageSlider').removeData('nivo:vars'); 
    $('#imageSlider').removeData('nivoslider'); 
    $('#imageSlider').attr("class",""); 
    $('#imageSlider').attr("style",""); 
} 

$('#imageSlider').html(newImages); 

然後$('#imageSlider').nivoSlider();

它有點兒工作,但旋轉卡住一幅圖象通話只,有時它只是不加載。任何幫助,將不勝感激。

回答

2

我找到了解決方案。而不是隻替換裏面的圖像,而是替換html內部。所以就像製作新的nivoslider內容一樣,它適用於我。話又說回來initlize nivoslider的所有參數

Ajax響應後 -

j('.slider-wrapper').html(''); 
    j('.slider-wrapper').html(request); 

    j('#slider').nivoSlider({ 
     effect: 'fade', // Specify sets like: 'fold,fade,sliceDown' 
     slices: 15, // For slice animations 
     boxCols: 8, // For box animations 
     boxRows: 4, // For box animations 
     animSpeed: 5, // Slide transition speed 
     pauseTime: 3000, // How long each slide will show 
     startSlide: 0, // Set starting Slide (0 index) 
     directionNav: true, // Next & Prev navigation 
     directionNavHide: true, // Only show on hover 
     controlNav: false, // 1,2,3... navigation 
     controlNavThumbs: false, // Use thumbnails for Control Nav 
     controlNavThumbsFromRel: false, // Use image rel for thumbs 
     controlNavThumbsSearch: '.jpg', // Replace this with... 
     controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src 
     keyboardNav: true, // Use left & right arrows 
     pauseOnHover: true, // Stop animation while hovering 
     manualAdvance: false, // Force manual transitions 
     captionOpacity: 0.8, // Universal caption opacity 
     prevText: 'Prev', // Prev directionNav text 
     nextText: 'Next', // Next directionNav text 
     beforeChange: function(){}, // Triggers before a slide transition 
     afterChange: function(){}, // Triggers after a slide transition 
     slideshowEnd: function(){}, // Triggers after all slides have been shown 
     lastSlide: function(){}, // Triggers when last slide is shown 
     afterLoad: function(){} // Triggers when slider has loaded 
}); 
+0

如果我Ajax調用後使用上面我得到一個錯誤:_Uncaught的ReferenceError:請求不defined_ – Daniel

相關問題