Рекомендуемые сообщения

Solli    0

Задача такова:

Сейчас в карточке товара есть cloud zoom, хочу сделать под основным изображением слайд галерею из превьюшек.

Но не все так просто =)

По бокам от основного изображения сделал стрелки при клике на которые происходит листание след./предыдущее  изображение (самописный примитивный плагин). Так же при этом  меняется  адрес не только главного изображения, но и  якоря в котором он находится.

 

Что сделано: по клику на стрелки - листаеться карусель,  меняется главное изображение.

 

Задача: добиться изменения изображения внутри увеличенного изображения в cloud-zoom.

 

P.S. Насколько понял я - cloud zoom не принимает данные об изменении адреса изображения, он сам диктует эти данные.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти


  • Похожий контент

    • От wowez
      Здравствуйте, искал метод как изменять главное изображение по клику на дополнительном, нашел решение, называется thumb-image-swap vqmod - вот этот код.

      <file name="catalog/controller/product/product.php"> <operation> <search position="after"><![CDATA['popup' => $this->model_tool_image->resize($result['image'], $this->config->get('config_image_popup_width'), $this->config->get('config_image_popup_height')),]]></search> <add><![CDATA[// BOF oc_Thumb_image_swap.xml 'addthumb' => $this->model_tool_image->resize($result['image'], $this->config->get('config_image_thumb_width'), $this->config->get('config_image_thumb_height')), // EOF oc_Thumb_image_swap.xml]]></add> </operation> <operation> <search position="after"><![CDATA[$this->load->model('tool/image');]]></search> <add><![CDATA[// BOF oc_Thumb_image_swap.xml if ($product_info['image']) $this->data['addpopup'] = $this->model_tool_image->resize($product_info['image'], $this->config->get('config_image_additional_width'), $this->config->get('config_image_additional_height')); else $this->data['addpopup'] = ''; // EOF oc_Thumb_image_swap.xml]]></add> </operation> </file> <file name="catalog/view/theme/*/template/product/product.tpl"> <operation> <search position="before"><![CDATA[<?php echo $footer; ?>]]></search> <add><![CDATA[<!-- BOF oc_Thumb_image_swap.xml --> <?php if ($images) { ?> <script type="text/javascript"><!-- $(function(){ var imgs = <?php echo json_encode($images); ?>; var html = ''; $.each(imgs,function(i,image){ html += '<div class="image" style="display:none;"><a href="' + image.popup + '" title="<?php echo $heading_title; ?>" class="colorbox">'; html += '<img src="' + image.addthumb + '" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></div>'; $('.image-additional').before(html); html = ''; }) html = '<a href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>">'; html += '<img src="<?php echo $addpopup; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a>'; $('.image-additional').prepend(html); var images = $('div.left .image'); var thumbs = $('.image-additional a'); thumbs.removeClass('cboxElement').removeClass('colorbox'); images.children('a').colorbox({rel:'colorbox'}); thumbs.on('click',function(e){ e.preventDefault(); images.hide(); images.eq(thumbs.index(this)).show(); }); }); //--></script> <!-- EOF oc_Thumb_image_swap.xml --> <?php } ?>]]></add> </operation> </file>Ну тут понятно, добавились в контроллер в темплейт, и вот сам яваскрипт код, который обрабатывает скрытие и появление изображнеий + появление в колорбоксе, а у меня не колорбокс, а cloud-zoom который вызывается так.
      <div class="zoom-section"> <div class="image zoom-small-image"><a href="<?php echo $popup; ?>" class="thickbox cloud-zoom"> <img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" id="image" /></a></div></div> Яваскрипт я переделал так - ну уж простите как додумал.
      <script type="text/javascript"> $(function(){   var imgs = <?php echo json_encode($images); ?>;   var html = '';   $.each(imgs,function(i,image){     html += '<div class="zoom-section"><div class="image zoom-small-image" style="display:none;">';     html += '<a href="<?php echo $popup; ?>" class="thickbox cloud-zoom"><img src="' + image.addthumb + '" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>"/></a></div></div>';     $('.image-additional').before(html);     html = '';   })   html = '<a href="<?php echo $popup; ?>" class="thickbox cloud-zoom" >';   html += '<img src="<?php echo $addpopup; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a>';   $('.image-additional').prepend(html);   var images = $('div.right .image');   var thumbs = $('.image-additional a img');      thumbs.on('click',function(e){     e.preventDefault();     images.hide();     images.eq(thumbs.index(this)).show();   }); }); </script> Cloud-zoom работает только на первом изображении, при клике на дополнительных, изображение меняется, но cloud-zoom не работает, скажите что не так, как объединить эти две очень классных и полезных вещи.
    • От dimOk
      Доброго времени суток!
      Ребят, столкнулся с такой проблемой, не знаю как решить.
      Движек 1.5.4.1
      Понадобился zoom для фотографий товара. Много чего перебрал из модулей для выполнения этой задачи и остановился на webrasta-cloud-zoom-magnifier-simple-v3, взял его тут
      Всё прекрасно работает (модуль ставится через vqmod) но проблема в том, что модуль работает только на странице с конкретным товаром, а мне хотелось бы, чтобы он работал и на главной странице и в категориях (на странице со списком товаров).
      Может кто-то уже реализовал подобное?
      Подскажите пожалуйста решение для данного воопроса.
      Заранее благодарю!
    • От Ivan123
      Здравствуйте, вопрос как сделать http://www.yehudarotenberg.com/1980-1983-2/ так?
      Куда хоть рыть? Если кому-то тоже интересно, предлагаю объединить усилия, нашел это http://stackoverflow.com/questions/11392637/cloudzoom-with-fancybox, но пока всю суть все равно не понял.
       
  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу