有一个谷歌......
尝试更改我的网站滚动设置&什么都没发生。
任何人都有关于鼠标滚动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';
}
答案 0 :(得分:3)
该脚本看起来有点过时了。不再使用.load()
函数,也不再使用浏览器嗅探。使用鼠标滚轮插件(一个真正的宝石)的方法将更可靠和未来证明。这是一个使用它的脚本,使得函数本身非常紧凑:
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 ...如果有任何其他脚本取决于已弃用的功能(不是太多),有些东西可能会在它是更新。版本1.8中引入了.on
方法 - 如果您想坚持使用旧版本,则上述脚本需要进行少量重写。
答案 1 :(得分:1)
在脚本标记
中添加此功能并在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)');
});
});
})
示例:fiddled here
检查天气这是你想要的