Làm thế nào để thay đổi scrollspeed mặc định, scrollamount, scrollinertia của một trang web

Question

Tôi Tring để thay đổi tốc độ di chuyển mặc định, số lượng và quán tính của một webpage.I google rất nhiều, nhưng vô ích

May mắn thay, sau đó, này ngày, tôi tìm thấy a plugin cho phép chúng tôi thay đổi tốc độ cuộn, số lượng, quán tính CHỈ CÓ một thẻ div cụ thể và không phải trong toàn bộ trang web.

Đây là một mã cơ bản

$(".I-WILL-APPLY-ONLY HERE").mCustomScrollbar({ 
set_width:false, 
set_height:false, 
horizontalScroll:false, 
scrollInertia:550, 
SCROLLINERTIA:"easeOutCirc", 
mouseWheel:"auto", 
    autoDraggerLength:true, 
    scrollButtons:{ 
enable:false, 
     scrollType:"continuous", 
    SCROLLSPEED:20, 
     SCROLLAMOUNT:40 
    }, 
    advanced:{ 
updateOnBrowserResize:true, 
    updateOnContentResize:false, 
     autoExpandHorizontalScroll:false, 
    autoScrollOnFocus:true 
    }, 
      callbacks:{ 
    onScrollStart:function(){}, 
    onScroll:function(){}, 
onTotalScroll:function(){}, 
    onTotalScrollBack:function(){}, 
    onTotalScrollOffset:0, 
whileScrolling:false, 
     whileScrollingInterval:30 
} 
    }); 



<div id="I-WILL-APPLY-ONLY HERE" class="I-WILL-APPLY-ONLY HERE"> 
A basic height in pixels would be defined for this element and any content appearing here will have a different scrollspeed,inertia.Mentioning heignt of this div element is compulsary,else i wont show the output </div> 

Vấn đề là tôi muốn cho toàn bộ trang và không chỉ đơn thuần là một withing đặc biệt div element.Any trợ giúp sẽ được appreciated.Please giúp tôi

Cảm ơn trước

Answer 1

Lý do không bao bọc HTML trong div vùng chứa và nhắm mục tiêu, như sau:

<div class="container"> 
    <div id="I-WILL-APPLY-ONLY HERE" class="I-WILL-APPLY-ONLY HERE"> 
<!-- Content here --> 
    </div> 
</div> 

Sau đó nhắm vào lớp container của bạn trong jQuery:

$('.container').mCustomScrollbar... 

Answer 2

Bạn có thể sử dụng jQuery để làm điều đó, hãy xem trong fiddle tôi: http://jsfiddle.net/promatik/NFk2L/

Bạn có thể thêm một người biết lắng nghe sự kiện của sự kiện cuộn , lưu ý rằng bạn có thể ngăn tác vụ Mặc định của cuộn ... if (event.preventDefault) event.preventDefault();

Sau đó, trình xử lý sự kiện đó, sử dụng jQuery animate, sẽ thực hiện cuộn ...

function handle(delta) { 
    var time = 1000; 
    var distance = 300; 

    $('html, body').stop().animate({ 
     scrollTop: $(window).scrollTop() - (distance * delta) 
    }, time); 
} 

Bạn có thể thiết lập thời gian, khoảng cách (và bạn cũng có thể thêm một phương pháp nới lỏng định), xem toàn bộ ví dụ trong fiddle