|
|
Модератор форума: Yuri_G |
Сообщество uCoz Архивариус Решённые вопросы Зуммер картинок в ИМ (вызвать скрипт при клике по изображен) |
Зуммер картинок в ИМ (вызвать скрипт при клике по изображен) |
Доброго времени суток. Имеется следующая проблема. Есть зуммер изображений. Он работает и вызывается следующим скриптом:
Код <script src='/js/jquery.elevateZoom-3.0.8.min.js' type="text/javascript"></script> <script> $("#ipreview").elevateZoom(); </script> Необходимо, чтоб он увеличивал изображения в одном окне, которые меняются по клику снизу. Код <img alt="" src="$THUMB$" data-zoom-image="$PHOTO$" class="gphoto" onclick="_bldCont1($ID$, this.getAttribute('idx'));" id="ipreview" idx="0" title="Кликните для увеличения изображения"> <?if($SMALL_1$)?> <img alt="" src="$SMALL$" class="gphoto im" onclick="var el=getElementById('ipreview'); el.src='$THUMB$'; el.setAttribute('data-zoom-image','$PHOTO$'); el.setAttribute('idx',0);"> <img alt="" src="$SMALL_1$" class="gphoto im1" onclick="var el=getElementById('ipreview'); el.src='$THUMB_1$'; el.setAttribute('data-zoom-image','$PHOTO_1$'); el.setAttribute('idx',1);"> <?endif?> <script src='/js/jquery.elevateZoom-3.0.8.min.js' type="text/javascript"></script> <script> $("#ipreview").elevateZoom(); </script> Так это работает сейчас - http://nevesta.at.ua/shop/2/desc/abelija Скрипт вызывается при загрузке страници и при смене картинки выводит постоянно первую картинку, хотя scr и data-zoom-image меняются на 2-е изображение. Наконец, вопрос! Как сделать так, чтоб при клике по изображению, скрипт срабатывал снова, подгружая параметры второго изображения? Steve Jobs: Stay hungry, stay foolish!
Сообщение отредактировал alex-g - Среда, 09 Апр 2014, 21:27:57
|
_ошибся
Добавлено (09 Апр 2014, 21:36:39) Сообщение отредактировал SOCHI1014 - Среда, 09 Апр 2014, 21:33:46
|
SOCHI1014, спасибо за ответ. Но IF тут не при чем. Он нужен для вывода 2х изображений внизу под основным изображением. То есть, если картинка одна, то вот это не выводится (миниатюра основного изображения)
Код <img alt="" src="$SMALL$" class="gphoto im" onclick="var el=getElementById('ipreview'); el.src='$THUMB$'; el.setAttribute('data-zoom-image','$PHOTO$'); el.setAttribute('idx',0);"> Если их 2, то выводится 1 и 2 изображение в одном условии. Steve Jobs: Stay hungry, stay foolish!
|
|
ipreview необходим для смены этих картинок. Точнее смене содержимого изображения при клике на миниатюру.
Зумер так же можно привязать к любому классу. Но даже если сделать отдельный класс всем новым изображениям, зуммер не будет их открывать, так как скрипт срабатывает при старте страници, а класс меняется при нажатии изображения, уже после загрузки страници Steve Jobs: Stay hungry, stay foolish!
|
Попробуйте так
<img alt="" src="$THUMB$" data-zoom-image="$PHOTO$" class="gphoto" onclick="_bldCont1($ID$, this.getAttribute('idx'));" id="ipreview" idx="0" title="Кликните для увеличения изображения"> <img alt="" src="$THUMB_1$" data-zoom-image="$PHOTO_1$" class="gphoto" onclick="_bldCont1($ID$, this.getAttribute('idx'));" id="ipreview" idx="1" title="Кликните для увеличения изображения"> <?if($SMALL_1$)?> <img alt="" src="$SMALL$" class="gphoto im" onclick="var el=getElementById('ipreview'); el.src='$THUMB$'; el.setAttribute('data-zoom-image','$PHOTO$'); el.setAttribute('idx',0);"> <img alt="" src="$SMALL_1$" class="gphoto im1" onclick="var el=getElementById('ipreview'); el.src='$THUMB_1$'; el.setAttribute('data-zoom-image','$PHOTO_1$'); el.setAttribute('idx',1);"> <?endif?> |
| |||
| |||
Будьте в курсе всех обновлений: подпишитесь на наш официальный Telegram-канал uCoz и задавайте вопросы в чате сообщества!