управление mousewheel

[laliev]

$('.vertical_slide').on('mousewheel', function(event, delta){      pathname = window.location.hash;      if (delta> 0 ) {        window.location.hash = pathname +1;     }else {        window.location.hash = pathname +1;      }});         

есть такой код, который добавляет к текущему урлу + 1 по событию mousewheel(часть кода преобразования в число вырезана ) и вот проблема в том что если прокрутить очень сильно за раз то добавляться может и +4 сразу. как можно решить эту проблему подскажите пожалуйста, что бы пр любом уровне прокрутки добавлялся +1!

 

Спасибо за внимание!

[Switch74]

привязка к урлу была бы в тему для передачи норм ссылок

у меня получилось вот так, но можно упростить еще
span сделал для отображения hash

[antonKar]

deltaY может возвращать как -1 и 1, так и -2 и 2 и т.д.

 

Используйте Math.sign для работы с deltaY, которое для чисел возвращает -1 и 1. Вот на -1 и 1 проверяйте у себя в условии.

Edited May 18, 2015 by antonKar

[Switch74]

проверяйте на знак, если у вас меньше 0, то делает -1, если больше, то +1. При этом думаю вам нужно будет проверять результат на равенство 0 и какого-то максимума

[laliev]

проверяйте на знак, если у вас меньше 0, то делает -1, если больше, то +1. При этом думаю вам нужно будет проверять результат на равенство 0 и какого-то максимума

  if (delta> 0 ) {        window.location.hash = pathname +1;     }else {        window.location.hash = pathname +1;      }

я думал это и есть проверка

[antonKar]

Math.sign = Math.sign || function(x) {

x = +x; // преобразуем в число

if (x === 0 || isNaN(x)) {

return x;

}

return x > 0 ? 1 : -1;

}

$('.vertical_slide').on('mousewheel', function(event){

pathname = window.location.hash;

if (Math.sign(event.deltaY) == 1) {

window.location.hash = pathname + 1;

} else if (Math.sign(event.deltaY) == -1) {

window.location.hash = pathname + 1;

}

});

[laliev]

может я не в совокупности своей проблемы что то не правильно объяснил!  

 

может нагляднее лучше будет 

 

вот  посмотрите что происходит с урлом при быстром перелистывании с 1 по 5 слайд и обратно. а хочется что бы они всегда соответствовали нужной странице! 

[Switch74]

дык у вас в корне не верный подход.

Крутанули мы колесико - начинается анимация и меняется хэш на 2

предположим курсор все еще находится над старым(уходящим) блоком и мы еще раз крутанем, у вас хэш сменится на 3, а стили применятся как будто у вас сейчас идет смена на вторую страничку

 

1. Вам бы сделать проверку скролла на боди или какой-то врапер общий для всех блоков/страниц

2. Сделать проверку хэша и исходя из него менять стили, а не отталкиваться от того над каким блоком был произведен скролл

[laliev]

дык у вас в корне не верный подход.

Крутанули мы колесико - начинается анимация и меняется хэш на 2

предположим курсор все еще находится над старым(уходящим) блоком и мы еще раз крутанем, у вас хэш сменится на 3, а стили применятся как будто у вас сейчас идет смена на вторую страничку

 

1. Вам бы сделать проверку скролла на боди или какой-то врапер общий для всех блоков/страниц

2. Сделать проверку хэша и исходя из него менять стили, а не отталкиваться от того над каким блоком был произведен скролл

а может есть какой то вариант типа запретить на время анимации все действия в том числе смену хэша ?

[Switch74]

ну тут вам опять же тогда нужно будет сделать проверку - но это будет сложнее сделать чем упростить код и сделать все более логично
 

[antonKar]

То есть сложнее?

 

block = false;

 

if (!block) {

    block = true;

    $("div").animate({ "blabla": 0, function() { block = false; } })

}

[Switch74]

а вы посмотрите общий код в котором сделано N обработчиков вместо одного + дополнительные проверки

просто зачем городить заплатки на шаравары, если можно сделать штаны по размеру

[laliev]

я уже все варианты перепробовал и все равно коряво работает ну или руки кривые  в общем у меня задача по текучему слайду определить сделать активный пункт меню. возможно  это можно сделать без привязки к урлу? какие варианты могут быть? уже совсем запутался    

Edited May 18, 2015 by laliev

[antonKar]

возможно  это можно сделать без привязки к урлу?

Да, для этого переменные придумали.

	$('.link_slide1').on('click', function(event, delta){				$('.horizontal_slides').removeClass("left_transform_horizintal");				$('.horizontal_slides').removeClass("right_transform_horizintal");				 				$(".horizontal_slide1").addClass("");				$(".horizontal_slide2").addClass("");				$(".horizontal_slide3").addClass("");				$(".horizontal_slide4").addClass("");				$(".horizontal_slide5").addClass(""); 	 });	

жесть, да

[laliev]

 

возможно  это можно сделать без привязки к урлу?

Да, для этого переменные придумали.

	$('.link_slide1').on('click', function(event, delta){				$('.horizontal_slides').removeClass("left_transform_horizintal");				$('.horizontal_slides').removeClass("right_transform_horizintal");				 				$(".horizontal_slide1").addClass("");				$(".horizontal_slide2").addClass("");				$(".horizontal_slide3").addClass("");				$(".horizontal_slide4").addClass("");				$(".horizontal_slide5").addClass(""); 	 });	

жесть, да

 

согласен. всем спасибо за помощь !

[laliev]

Спасибо большое Вам! Жаль я уже костыль сделал, но обязательно разберусь с вашим кодом! Спасибо большое!