вопрос по вертикальной карусели
Вложений: 3
Доброго дня.
Есть галерея как на ВБ. Слева карусель с миниатюрами, справа большое фото (Скриншот 1) При перелистывании стрелками вертикальной карусели миниатюры уходят за границы блока, и можно пролистать, чтобы они вообще ушли вниз или вверх. Пытаюсь на jquery ограничить это движение. Суть в том, что margin-top не должно уходить в минус, чтобы миниатюры не уезжали вниз (Скриншот 2). И так же при пролистывании до самого низу миниатюры не должны уходить вверх (Скриншот 3) кода много, поэтому закинул в фидл: https://jsfiddle.net/tps20/41bgyLh9/6/ Пробовал таким образом, но не помогает: по моей логике: если margin-top уходит в минус, то прекратить выполнять функцию. if($('#images-additional_wrapper').css("margin-top")<'0px') { return false; } |
tp-20,
...вариант function down(id, h) { let margin_top = parseFloat($('#images-additional_wrapper').css('margin-top')); let max = parseFloat($('.images-additional').css('height')) - parseFloat($('#images-additional_wrapper').css('height')); if (margin_top - h < max) h = margin_top - max; $('#images-additional_wrapper').animate({ 'margin-top': '-=' + h + 'px', }); } function up(id, h) { let margin_top = parseFloat($('#images-additional_wrapper').css('margin-top')); if (margin_top + h > 0) h = -margin_top; $('#images-additional_wrapper').animate({ 'margin-top': '+=' + h + 'px', }); } |
рони, огромное спасибо, идеальное решение! в вашей помощи не сомневался! :thanks:
|
рони, добрый день.
добавил прокрутку мышкой в вертикальную галерею, но перестали работать кнопки вверх/вниз. в стили для класса images-additional_wrapper добавил свойство height: 100%; overflow-y: scroll; Если высоту height: 100% убрать, то кнопки работают, но скроллинг не работает. Возможно ли как-то совместить, чтобы и кнопки и скролл работали? фидл тот же самый: https://jsfiddle.net/tps20/41bgyLh9/6/ заранее спасибо |
tp-20,
решение наверняка есть, но нет возможности помочь. |
Часовой пояс GMT +3, время: 18:54. |