Помощник
|
Прошу помощи с небольшой доработкой скрипта слайдера и.магазина |
S1xteen
|
Сообщение
#1
|
||
|
|
||
|
|||
tszyan |
21.3.2013, 19:14;
Ответить: tszyan
Сообщение
#2
|
|
большого изображения при наведении на миниатюру, а не только по клику Непонятно как Вы хотите чтобы оно работало. Большое изображение отображается для центральной миниатюры. Боковая становится центральной при клике, далее не двигая мышкой можно кликать до посинения и будут меняться картинки. Если сделать смену картинок при наведении, то они будут меняться постоянно, даже без кликов, когда курсор мышки находится на боковом изображении. Вы так и хотите? |
|
|
S1xteen
|
Сообщение
#3
|
|
tszyan, Да, мне так и нужно.
|
|
|
tszyan |
21.3.2013, 23:41;
Ответить: tszyan
Сообщение
#4
|
|
Можете добавить внутрь $(document).ready следующее:
var tick = 1000; var mouseX, mouseY; $('body').on('mousemove', function (e) { mouseX = e.pageX == undefined ? mouseX : e.pageX; mouseY = e.pageY == undefined ? mouseY : e.pageY; }); setInterval(function () { var first = $('.etalage_smallthumb_first'); var offset = first.offset(); var deltaX = mouseX - offset.left; var deltaY = mouseY - offset.top; if (deltaX > 0 && deltaX < first.width() && deltaY > 0 && deltaY < first.height()) { etalage_previous(); } var last = $('.etalage_smallthumb_last'); var offset = last.offset(); var deltaX = mouseX - offset.left; var deltaY = mouseY - offset.top; if (deltaX > 0 && deltaX < last.width() && deltaY > 0 && deltaY < last.height()) { etalage_next(); } }, tick); В хроме/сафари будет глючить при данном варианте верстки. В них есть баг, что onmousemove при некоторых условиях перестает работать. Вообще с отслеживанием данного события лучше не связываться без необходимости. Сообщение отредактировал tszyan - 21.3.2013, 23:42 |
|
|
S1xteen
|
Сообщение
#5
|
|
tszyan, Почти то, что надо, а как убрать зацикливание после наведения?
т.е когда наводим на правую миниатюру, они смещаются влево и под курсор попадает следующая миниатюра, срабатывает событие и снова смещаются влево, получается самопроизвольное бесконечное листание. Пример как нужно |
|
|
tszyan |
22.3.2013, 0:56;
Ответить: tszyan
Сообщение
#6
|
|
Почти то, что надо, а как убрать зацикливание после наведения? Именно про это я и писал: Если сделать смену картинок при наведении, то они будут меняться постоянно, даже без кликов На Вашем новом примере - совершенно другое и без анимации перемещения миниатюр было бы гораздо проще. А так - все равно не совсем понятно как Вы хотите чтобы это работало. Можете так попробовать (вместо того что до этого прислал): var move = true;
$(document).on('mouseenter', '.etalage_smallthumb_first', function(){ if(move) etalage_previous(); move = false; }); $(document).on('mouseleave', '.etalage_smallthumb_first, .etalage_smallthumb_last', function(){ move = true; }); $(document).on('mouseenter', '.etalage_smallthumb_last', function(){ if(move) etalage_next(); move = false; }); Сообщение отредактировал tszyan - 22.3.2013, 0:58 |
|
|
S1xteen
|
Сообщение
#7
|
|
Мне нужно максимально похожее как в примере. Я искал готовый скрипт, обыскал очень много сайтов, удалось найти только вот такой. Подумал что доработать будет намного проще, чем выдерать с какого-то сайта.
Идеальным будет такой вариант, но обязательно нужно отображение увеличенного изображения при наведении на миниатюру. |
|
|
tszyan |
22.3.2013, 2:54;
Ответить: tszyan
Сообщение
#8
|
|
S1xteen,
Чтобы нормально работало - надо выбрать что-то одно: либо с наведением на миниатюру, либо со скроллингом миниатюр. Если скрещивать - получаются примеры выше. Причем реализовать можно многое, только Вы сами мне не можете описать что хотите получить. Семь красных линий. Все они должны быть строго перпендикулярны, и кроме того, некоторые нужно нарисовать зеленым цветом, а еще некоторые — прозрачным. UPDATE: Добавлю. Сделать как где-то - просто. Либо "вытащить" оттуда, либо написать исследовав как оно работает. Сделать как там, но с ... - зачастую не реально, но если хочется - надо четко себе представлять как оно должно работать вплоть до мелочей. Так чтобы написать ТЗ и после реализации по этому ТЗ не возникало непоняток: "А я хотел по-другому".http://www.maultalk.com/topic146711s0.html?gopid=1580813&# UPDATE 2: Вот интересное решение. В нем, наверное, можно и при наведении отображать картинки: http://www.tn3gallery.com/ еще похожее: http://wowslider.com/css-slideshow-studio-fade.html Вот обычный, где легко можно сделать отображение при наведении: http://www.twospy.com/galleriffic/example-2.html UPDATE 3: Ответьте себе на вопрос. Почему среди нескольких сотен слайдеров/галерей нет тех что совмещают анимацию миниатюр и отображение при наведении? (Разве что 2 кнопки слева и справа поставить для прокрутки с анимацией, а при наведении менять картинку). Сообщение отредактировал tszyan - 22.3.2013, 2:56 |
|
|
S1xteen
|
Сообщение
#9
|
|
|
Ладно, я не буду продолжать.
Спасибо за потраченное на меня время.
|
|
|
||
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
Требуется разработка скрипта для интернет-магазин автоматической покупки игр с сайта Xbox | 2 | slavalist | 746 | 10.1.2023, 3:09 автор: slavalist |
|
Нудаюсь в помощи WP ускорить по PageSpeed |
13 | MihalychAIP | 2694 | 20.4.2022, 2:10 автор: sergogogo |
|
Посоветуйте скрипт интернет-магазина (партнерская программа - критична!) |
9 | Aloof | 7367 | 2.12.2021, 15:03 автор: Ilonek |
|
Платформа для мебельного магазина | 0 | icefog | 4785 | 1.3.2021, 17:20 автор: icefog |
|
Доработка интернет-магазина на Opencart | 1 | MaxNet | 909 | 14.12.2020, 12:26 автор: MaxNet |
Текстовая версия | Сейчас: 24.4.2024, 1:31 |