Перекрестное колесо мыши, чтобы прокрутить 100% высоты браузера одним колесом
Есть некоторые JS
$(document).ready(function(){
var winHeight = window.innerHeight ?
function() {
return window.innerHeight;
} :
function() {
return document.documentElement.clientHeight;
};
$('.first-block').height(winHeight);
$(window).scroll(function(){
var firstBlockHeight = winHeight();
var scrollTop= $('body').scrollTop();
if (scrollTop > 0 && scrollTop < firstBlockHeight/2 && $('body').hasClass('scrolled') === false) {
$("body")
.animate({ scrollTop: firstBlockHeight+10 }, 600)
.addClass('scrolled');
} else if (scrollTop==0) {
$("body")
.animate({ scrollTop: 0 }, 600)
.removeClass('scrolled');
}
});
});
который прокручивает первый блок на 100% высотой одним колесом мыши. Этот код не работает в Firefox.. И есть ошибки, если играть с прокруткой.. Помогите, пожалуйста, исправить это и добавить поддержку кросс-браузер. Смотрите пожалуйста JsFiddle.
Благодарю.
1 ответ
Решение
Я использую mouswheel.js и делаю это!:) может быть кому-то пригодится
$(document).ready(function(){
var winHeight = window.innerHeight ?
function() {
return window.innerHeight;
} :
function() {
return document.documentElement.clientHeight;
};
$('.first-block').height(winHeight);
var BlockHeight = $('.first-block').height();
$.browser = {};
$.browser.mozilla = /mozilla/.test(navigator.userAgent.toLowerCase()) && !/webkit/.test(navigator.userAgent.toLowerCase());
if($.browser.mozilla)
{
var ScrollType = 'html';
}
else
{
var ScrollType = 'body';
}
$('.first-block').mousewheel(function(event, delta, deltaX, deltaY) {
if((delta<0) && ($(ScrollType).scrollTop()==0)) $(ScrollType).animate({ scrollTop: BlockHeight- 104 }, 600);
});
$(ScrollType).keydown(function(event){
if((event.keyCode==40) && ($(ScrollType).scrollTop()==0)) $(ScrollType).animate({ scrollTop: BlockHeight-104 }, 600);
})
});
спасибо за меня)