NiceScroll không hoạt động sau khi tải AJAX

Question

Tôi gặp sự cố với Nice Scroll. Nó hoạt động tốt, nhưng khi tôi tải hình ảnh AJAX nó không hoạt động. Thật thú vị, khi tôi thay đổi kích thước cửa sổ, mở Firebug hoặc bất cứ điều gì, nó bắt đầu hoạt động.

Tôi có thể làm gì để tự động thực hiện việc này?

tôi đã cố gắng:

setTimeout(function(){ 
    $("window").trigger('resize'); 
}, 0); 

Sau khi chức năng tải AJAX, nhưng nó không hoạt động.

Answer 1

Khi nội dung trên thay đổi div của bạn, bạn cần phải gọi phương thức thay đổi kích thước nicescroll.

$("your-div-name").getNiceScroll().resize() 

Hãy nhớ nếu kích thước hình ảnh không được đặt trong thẻ img, bạn cần gọi lại kích thước khi tất cả hình ảnh được tải đầy đủ.

Answer 2

Vui lòng sử dụng mã bên dưới để giải quyết sự cố của bạn. Nó hoạt động tốt với tải ajax.

$("MYSCROLLCONTAINERS").getNiceScroll().remove(); 
$("div[id^='ascrail']").remove(); 
jQuery("MYSCROLLCONTAINERS").niceScroll({ 
       autohidemode:false 
      }); 

Điều này phù hợp với tôi.

Answer 3

Ngoài câu trả lời của InuYaksa Nếu bạn không có quyền truy cập vào triển khai, bạn chỉ có thể triển khai chức năng di chuột trên trình bao bọc nội dung dưới dạng giải pháp thay thế.

// Call resize whenever mouse 
$("#scroll-area").mouseover(function() { 
    $("#scroll-area").getNiceScroll().resize(); 
}); 

từ: http://eureka.ykyuen.info/2013/05/07/jquery-nicescroll-plugin-doesnt-work-for-dynamic-content/

Cải thiện mouseover giải pháp

//in the case of scrolling content loaded via AJAX 
    $(document).on('mouseover','#scroll-area', function() { 
     $(this).getNiceScroll().resize(); 
    }); 

Sử dụng viewport/quấn

$(document).on('mouseover','#scroll-wrap', function() { 

    var widget_wrap=$(this); 
    var widget_viewport=$(this).parent(); 

    widget_viewport.getNiceScroll(widget_wrap).resize(); 

});