Mr.Nito (19 Январь 2018 - 20:15) писал:
заменил
// Галерея изображения и Фильтры в карточке Товара function goodspage() { $('.thumblisticon').click(function(){ var url = $(this).attr('href'); $('.general-img').find('img').attr('src', url).attr('data-large', url); $('.general-img').find('a').attr('href', url); return false; });
на
// Галерея изображения и Фильтры в карточке Товара function goodspage() { $('.thumblisticon').click(function(){ var url = $(this).attr('href'); $('.general-img').find('img').attr('src', url).attr('data-large', url); $('.general-img').find('a').attr('href', url); $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom(); return false; });
Рамку убрал в cloud-zoom.css
/* This is the zoom window. */ .cloud-zoom-big { border: 0px solid #ccc; overflow:hidden; }
2.Иконку с увеличением:
Код
в main.js
// Открытие изображения товара при клике $(document).ready(function() { $('.zoom-icon').on('click',function(){ $('.popup-gallery').magnificPopup({ delegate: 'a', type: 'image', tLoading: 'Загружаем изображение #%curr%...', mainClass: 'mfp-img-mobile', gallery: { enabled: true, navigateByImgClick: true, preload: [0,1] // Will preload 0 - before current, and 1 after the current image }, image: { tError: '<a href="%url%">Изображение #%curr%</a> не загружено.', titleSrc: function(item) { return item.el.attr('title') + '<small>StoreLand.ru</small>'; } } }).magnificPopup('open'); }) });
в шаблон Товар
{% IF GOODS_IMAGE_EMPTY %} <img src="{ASSETS_IMAGES_PATH}no-photo-medium.png?design=spring" alt="{GOODS_NAME}" title="Увеличить {GOODS_NAME}" class="thumbnail .goods-image-medium "/> {% ELSE %} <div class="zoom-icon"> <style> .zoom-icon { width: 60px; height: 60px; position: absolute; z-index: 10000; left: 0; top: 0; cursor: pointer; background: url('{ASSETS_IMAGES_PATH}zoom-in.png'); } </style> </div> <a itemprop="image" href="{GOODS_IMAGE_LARGE}" title="Увеличить {GOODS_NAME}" class="cloud-zoom " id="zoom1" rel="position: 'inside', showTitle: false, adjustX: 19, adjustY:0" style="position: relative; display: block;"> <img src="{GOODS_IMAGE_MEDIUM}" title="{GOODS_NAME}" alt="{GOODS_NAME}" id="image" style="display: block;" class=".goods-image-medium" /> </a> {% ENDIF %}
Как можно починить карусель галереи внизу, под главным фото, перестала работать ?