Search the Community

Здравствуйте, искал метод как изменять главное изображение по клику на дополнительном, нашел решение, называется 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 не работает, скажите что не так, как объединить эти две очень классных и полезных вещи.

Доброго времени суток! Ребят, столкнулся с такой проблемой, не знаю как решить. Движек 1.5.4.1 Понадобился zoom для фотографий товара. Много чего перебрал из модулей для выполнения этой задачи и остановился на webrasta-cloud-zoom-magnifier-simple-v3, взял его тут Всё прекрасно работает (модуль ставится через vqmod) но проблема в том, что модуль работает только на странице с конкретным товаром, а мне хотелось бы, чтобы он работал и на главной странице и в категориях (на странице со списком товаров). Может кто-то уже реализовал подобное? Подскажите пожалуйста решение для данного воопроса. Заранее благодарю!

Здравствуйте, вопрос как сделать http://www.yehudarotenberg.com/1980-1983-2/ так? Куда хоть рыть? Если кому-то тоже интересно, предлагаю объединить усилия, нашел это http://stackoverflow.com/questions/11392637/cloudzoom-with-fancybox, но пока всю суть все равно не понял.

Задача такова: Сейчас в карточке товара есть cloud zoom, хочу сделать под основным изображением слайд галерею из превьюшек. Но не все так просто =) По бокам от основного изображения сделал стрелки при клике на которые происходит листание след./предыдущее изображение (самописный примитивный плагин). Так же при этом меняется адрес не только главного изображения, но и якоря в котором он находится. Что сделано: по клику на стрелки - листаеться карусель, меняется главное изображение. Задача: добиться изменения изображения внутри увеличенного изображения в cloud-zoom. P.S. Насколько понял я - cloud zoom не принимает данные об изменении адреса изображения, он сам диктует эти данные.