如何更改网页的默认滚动速度，滚动条数量，滚动条数量 [英] How to change default scrollspeed,scrollamount,scrollinertia of a webpage

问题描述

我很想改变网页的默认滚动速度，数量和惯性。我的谷歌很多，但徒劳无功

幸运的是，今天晚些时候， ，我找到了一个插件，它允许我们改变滚动速度，数量，惯量，只在特定的div标记，而不是整个网页。

这里是一个基本代码

  $（。I-WILL-APPLY-ONLY HERE）。mCustomScrollbar（{
 set_width：false，
 set_height：false，
 horizo​​ntalScroll：false，
 scrollInertia：550，
 SCROLLINERTIA：easeOutCirc，
 mouseWheel：auto，
 autoDraggerLength：true，
 scrollButtons：{
 enable：false，
 scrollType：continuous，
 SCROLLSPEED：20，
 SCROLLAMOUNT：40 
}，
高级：{
 updateOnBrowserResize：true，
 updateOnContentResize ：false，
 autoExpandHorizo​​ntalScroll：false，
 aut oScrollOnFocus：true 
}，
回调：{
 onScrollStart：function（）{}，
 onScroll：function（）{}，
 onTotalScroll：function（）{ }，
 onTotalScrollBack：function（）{}，
 onTotalScrollOffset：0，
 whileScrolling：false，
 whileScrollingInterval：30 
} 
}）; 
 
 
 
< div id =我将只在这里申请class =我将只在这里申请> 
为这个元素定义一个基本的像素高度，这里出现的任何内容都会有不同的滚动速度，惯性。提示这个div元素是强制性的，否则我不会显示输出< / div> 
  

问题是我想要整个页面，而不仅仅是一个特定的div元素。任何帮助将不胜感激。请帮助我

预先致谢 你可以使用jQuery来做到这一点，
在我的小提琴中看看： http://jsfiddle.net / promatik / NFk2L /

您可以添加滚动事件的事件侦听器，请注意您可能会阻止滚动的默认操作...
if（event.preventDefault）event.preventDefault（）;

然后，该事件的处理程序，使用jQuery animate，将执行滚动...

pre code函数句柄（delta）{
var time = 1000 ;
var distance = 300;
$ b $（'html，body'）。stop（）。animate（{
scrollTop：$（window）.scrollTop（） - （distance * delta）
}，时间 ）;



$ b您可以设置时间，距离（也可以添加缓动方法），请参阅小提琴中的完整示例

I am tring to change the the default scrolling speed,amount and inertia of a webpage.I google a lot,but in vain

Fortunately,later,this day,I found a plugin which allows us to change the scrollspeed,amount,inertia ONLY WITHIN a particular div tag and not in the entire webpage.

Here is a basic code

    $(".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>

The issue is that i want for the entire page and not merely withing a particular div element.Any help would be appreciated.Please help me

Thanks in advance

解决方案

You can use jQuery to do that, take a look in my fiddle: http://jsfiddle.net/promatik/NFk2L/

You may add an event listener of the scroll event, be aware that you may prevent the Default action of the scroll ... if (event.preventDefault) event.preventDefault();

Then the handler of that event, using jQuery animate, will perform the scroll ...

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

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

You can set the time, distance (and you can also add an easing method), see the full example in the fiddle

这篇关于如何更改网页的默认滚动速度，滚动条数量，滚动条数量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！