Адаптация галереи по мобильные устройства
Всем привет!
Требуется помощь спецов. Есть галерея изображений. По наведению на миниатюру сменяется основная картинка: <div class="gallery-1"> <div class="gal-main"><img src="/images/001.jpg" class="main-img" /></div> <div class="gal-tumb" > <ul> <li><img src="/images/thumb/001.jpg" /></li> <li><img src="/images/thumb/002.jpg" /></li> <li><img src="/images/thumb/003.jpg" /></li> </ul> </div> </div> $(document).ready(function() { var galleryClass = '.gallery-1'; $(galleryClass+' li img').click(function(){ var $gallery = $(this).parents(galleryClass); $('.main-img',$gallery).attr('src',$(this).attr('src').replace('thumb/', '')); }); var imgSwap = []; $(galleryClass+' li img').each(function(){ imgUrl = this.src.replace('thumb/', ''); imgSwap.push(imgUrl); }); $(imgSwap).preload(); }); $.fn.preload = function() { this.each(function(){ $('<img/>')[0].src = this; }); } На ПК все работает отлично. Задача, чтобы на мобильнике она срабатывала при клике, а на ПК также при наведении. |
webmanss,
:-? js строка 3 $(galleryClass+' li img').on('click mouseenter touchstart',function(){ |
Спасибо рони, за попытку, но так не работает(
|
webmanss,
видимо у вас другой код, если Цитата:
Цитата:
Цитата:
|
рони,
Извиняюсь, изначально вместо .click был .hover При .hover по наведению работает, но только на ПК. Вопрос, как сделать чтоб и при клике работало. |
webmanss,
'mouseenter touchstart' --- должно работать, mouseenter для наведения в пк, touchstart для клика в мобильных |
Скрипт работает. Если кому пригодится. Проблема была в разметке.
Соседний DIV блок мешал. рони, как всегда респект! |
Часовой пояс GMT +3, время: 16:31. |