jQuery鼠標滾動腳本速度不會改變

Question

有一個谷歌...。

試圖更改我的網站滾動設置，但沒有任何反應。

有人在鼠標滾動jQuery腳本和函數上有文字或表格嗎？

（緩存已清除，跨瀏覽器測試等）

jQuery(window).load(function(){  

    if(checkBrowser() == 'Google Chrome' && device.windows()){

        if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);

            window.onmousewheel = document.onmousewheel = wheel;



            var time = 330;

            var distance = 300;


            function wheel(event) {

                if (event.wheelDelta) delta = event.wheelDelta / 90;

                else if (event.detail) delta = -event.detail / 3;

                handle();

                if (event.preventDefault) event.preventDefault();

                event.returnValue = false;

            }



            function handle() {

                jQuery('html, body').stop().animate({

                    scrollTop: jQuery(window).scrollTop() - (distance * delta)

                }, time);

            }

    }

});

function checkBrowser(){

    var ua = navigator.userAgent;



    if (ua.search(/MSIE/) > 0) return 'Internet Explorer';

    if (ua.search(/Firefox/) > 0) return 'Firefox';

    if (ua.search(/Opera/) > 0) return 'Opera';

    if (ua.search(/Chrome/) > 0) return 'Google Chrome';

    if (ua.search(/Safari/) > 0) return 'Safari';

    if (ua.search(/Konqueror/) > 0) return 'Konqueror';

    if (ua.search(/Iceweasel/) > 0) return 'Debian Iceweasel';

    if (ua.search(/SeaMonkey/) > 0) return 'SeaMonkey';

    if (ua.search(/Gecko/) > 0) return 'Gecko';

    return 'Search Bot';

}

Answer 1

該腳本看起來有些過時。 .load()函數已不再使用，瀏覽器嗅探也已棄用。 使用mousewheel插件（一種真正的寶石）的方法將更可靠，並且會面向未來。 這是一個使用它的腳本，使函數本身非常緊湊：

http://codepen.io/anon/pen/KpPdmX?editors=001

jQuery(window).on('load', function() {

  var time = 330;
  var distance = 300;

  jQuery(this).mousewheel(function(turn, delta) {

    jQuery('html, body').stop().animate({

      scrollTop: jQuery(window).scrollTop()-(distance*delta)

    }, time);

  return false;
  });
});

// mousewheel.js can be placed here, outside of function scope

該插件需要一些額外的腳本，但這是值得的。 還有一個wheel事件，但是不幸的是，Opera仍然不支持。 無論如何，都需要更多代碼來標准化鼠標滾輪的變化量（這是mousewheel.js最好的地方）。

我猜$字符保留在網頁上，但如果不是，則jQuery引用可以替換為它。 順便說一句-您可能要檢查網站上鏈接到的jQuery版本...如果有其他腳本取決於不推薦使用的功能（不是太多），則某些功能可能會在其停止運行時停止正確運行更新。 .on方法是在1.8版中引入的-如果您希望使用舊版本，則上述腳本將需要進行少量重寫。

Answer 2

在您的腳本標簽中添加此功能

並在您的body標簽中添加data-scroll-speed =“ 10”。 你可以調整身體的滾動速度

$(function () {
            var boxes = $('[data-scroll-speed]'),
        $window = $(window);
            $window.on('scroll', function () {
                var scrollTop = $window.scrollTop();
                boxes.each(function () {
                    var $this = $(this),
          scrollspeed = parseInt($this.data('scroll-speed')),
          val = -(scrollTop / scrollspeed);
                    $this.css('transform', 'translateY(' + val + 'px)');
                });
            });
        })

例如： 在這里擺弄

檢查天氣，這就是你想要的