Слайдер скролл + клик
Помогите, господа, разбирающиеся.
Наворотил я велосипед. Всё отлично работает, если не совмещать скролл и клик. В случае совмещения слайдер пролистывает пустые блоки. Правый слайдер вертикальный https://jetrus.ru/catalog/tokarnye-s...arnyy-stanok-/ document.addEventListener('DOMContentLoaded', function() { var slides = document.querySelectorAll('.acs-slide'), slider = document.querySelectorAll('.acs-slider')[0], next = document.querySelector('.acs-next'), prev = document.querySelector('.acs-prev'); longSlider = slides.length, // * 160 current = 0; if(slides === null || slider === null ) { return; } $('.acs-slider').on('mousewheel DOMMouseScroll', function(e) { var evt = e.originalEvent, slideLong = 160 / 120, scrollTo = (e.type == 'DOMMouseScroll' ? evt.detail * 40 : evt.wheelDelta * -1) * slideLong; if (scrollTo ) { e.preventDefault(); $(this).scrollTop(scrollTo + $(this).scrollTop()); current = slider.scrollTop; var sliderHeight = slider.scrollHeight - current; console.log(sliderHeight, current); } if(Math.abs(current) === sliderHeight) { console.log(current); } if(current === 0) { console.log(current); return false; } e.stopPropagation(); e.preventDefault(); }); if(longSlider > 2) { var slidePosition; longSlider = longSlider * 160; next.addEventListener('click', function(event) { event.preventDefault(); [].forEach.call(slides, function(slide, index) { var currentPosition = slider.scrollTop; if(current === 0) { currentPosition = parseInt(getComputedStyle(slide).top); currentPosition = currentPosition - 160; if(Math.abs(currentPosition) >= 0 && Math.abs(currentPosition) === longSlider) { return false; } else if (Math.abs(currentPosition) >= (longSlider - 360)) { return false; } var pos = longSlider - Math.abs(currentPosition) - 480; slide.style.top = currentPosition + 'px'; if(pos === 0) { next.style.opacity = '0.1'; } else { next.style.opacity = '1'; } } else { currentPosition = current; currentPosition = currentPosition - 160; if(Math.abs(currentPosition) >= 0 && Math.abs(currentPosition) === longSlider) { return false; } else if (Math.abs(currentPosition) >= (longSlider - 360)) { return false; } var pos = longSlider - Math.abs(slider.scrollTop); slide.style.top = currentPosition + 'px'; if(pos === 0) { next.style.opacity = '0.1'; } else { next.style.opacity = '1'; } } }); }); prev.addEventListener('click', function(event) { event.preventDefault(); [].forEach.call(slides, function(slide, index) { var currentPosition = parseInt(getComputedStyle(slide).top); currentPosition = currentPosition + 160; if (currentPosition > 0 ) { return false; } slide.style.top = currentPosition + 'px'; var pos = longSlider - Math.abs(currentPosition) - 480; if(pos === 0) { next.style.opacity = '0.1'; } else { next.style.opacity = '1'; } }) }) } else { longSlider = longSlider * 160; slider.style.height = longSlider + 'px'; next.style.display = 'none'; prev.style.display = 'none'; } }); |
Или напишите как их подружить кратчайшим путём
|
Часовой пояс GMT +3, время: 16:01. |