我正在为我的投资组合创建一个 OnePage。
每个站点都占屏幕的 100%。我希望当我使用鼠标滚轮滚动时,那个 Scroll 向下滚动 100%,这样我就可以直接进入下一个站点,而不是页面之间的某个位置。
有人能告诉我如何用 JS/jQuery 解决这个问题吗?
您还可以使用以下 onscroll 处理程序,它基于此答案:
$(document).ready(function () {
var divs = $('.mydiv');
var dir = 'up'; // wheel scroll direction
var div = 0; // current div
$(document.body).on('DOMMouseScroll mousewheel', function (e) {
if (e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) {
dir = 'down';
} else {
dir = 'up';
}
// find currently visible div :
div = -1;
divs.each(function(i){
if (div<0 && ($(this).offset().top >= $(window).scrollTop())) {
div = i;
}
});
if (dir == 'up' && div > 0) {
div--;
}
if (dir == 'down' && div < divs.length) {
div++;
}
$('html,body').stop().animate({
scrollTop: divs.eq(div).offset().top
}, 200);
return false;
});
$(window).resize(function () {
$('html,body').scrollTop(divs.eq(div).offset().top);
});
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
7067 次 |
| 最近记录: |