MS2 + msGallery zoom на товары
Подскажите пожалуйста, где я не прав в выводе изображений на странице товара:
вот ссылка на страницу товара
там у меня с zoom-ом проблема. Обычный lightbox как то не прикольно ставить.
Может я просто не правильно его установил?
Вот тут просто он красиво работает.. Спасибо.
вот ссылка на страницу товара
там у меня с zoom-ом проблема. Обычный lightbox как то не прикольно ставить.
Может я просто не правильно его установил?
Вот тут просто он красиво работает.. Спасибо.
Комментарии: 22
дополняю пост:
tpl.msGallery.row
tpl.msGallery.row
<li class="span2">
<a href="[[+360x450:default=`[[+url]]`]]" class="thumbnail" data-image="[[+url]]" rel="{gallery: 'gal1', smallimage: '[[+136x205]]',largeimage: '[[+360x450:default=`[[+url]]`]]'}">
<img src="[[+136x205]]" alt="" title="[[+name]]" width="136" height="205">
</a>
</li>
tpl.msGallery.outer<div id="msGallery">
<a rel="fancybox gal1" class="jqzoom" href="[[+image]]" target="_blank" >
<img src="[[+360x450]]" width="360" height="450" alt="" title="" id="mainImage" />
</a>
<ul class="thumbnails">
[[+rows]]
</ul>
</div>
<script type="text/javascript">
$(function() {
$('.jqzoom').jqzoom({
zoomType: 'standard',
lens:true,
preloadImages: false,
alwaysOn:false
});
});
</script>
Точнее тхумбы не работают, вернее в зумер они не попадают почему не пойму
А еще точнее
Пример в верстке
Пример в верстке
<ul id="thumblist" class="clearfix" >
<li><a class="zoomThumbActive" href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small1.jpg',largeimage: './imgProd/triumph_big1.jpg'}"><img src='imgProd/thumbs/triumph_thumb1.jpg'></a></li>
<li><a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small2.jpg',largeimage: './imgProd/triumph_big2.jpg'}"><img src='imgProd/thumbs/triumph_thumb2.jpg'></a></li>
<li><a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './imgProd/triumph_small3.jpg',largeimage: './imgProd/triumph_big3.jpg'}"><img src='imgProd/thumbs/triumph_thumb3.jpg'></a></li>
</ul>
и кусок tpl.msGallery.row в котором href<a href="[[+360x450:default=`[[+url]]`]]" class="thumbnail"..
уже занят и как javascript:void(0) туда запихнуть?<li class="span2">
<a href="[[+360x450:default=`[[+url]]`]]" class="thumbnail" data-image="[[+url]]" rel="{gallery: 'gal1', smallimage: '[[+136x205]]',largeimage: '[[+360x450:default=`[[+url]]`]]'}">
<img src="[[+136x205]]" alt="" title="[[+name]]" width="136" height="205">
</a>
</li>
ВСЕ подобные вопросы решаются одним способом:
1. Заставить это работать на html+css+js
2. Заставить сниппет генерировать точно такой же html
1. Заставить это работать на html+css+js
2. Заставить сниппет генерировать точно такой же html
так я не вкурю в каком сниппете оно генерирует код текущего(дефолтного) показа картинок (галереи)
добавил событие к ссылке
добавил событие к ссылке
onclick="reloadd();"
и$(function reloadd() {
//Some code
return false;
});
а оно картинку не хочет показывать, видимо в сниппете оно добавляет свое действие. но в каком я чет не найду
Там 3 чанка, с говорящими именами: row, empty и outer.
Как думаешь, в котором выводится «код текущего(дефолтного) показа картинок (галереи)»?
В чанке «ряд», «строка», или «обертка»? Просто, попробуй угадать?
Как думаешь, в котором выводится «код текущего(дефолтного) показа картинок (галереи)»?
В чанке «ряд», «строка», или «обертка»? Просто, попробуй угадать?
хаха, сарказм, прикольно ))
я про то, что я не могу заменить
или просто не понимаю как…
а вы мне про подумай и угадай где оно выводится.
Ну вернее я мог не так выразить свою мысль.
я про то, что я не могу заменить
<a href="[[+360x450:default=`[[+url]]`]]"
на<a href="javascript:void(0);"
так как не отображается картинкаили просто не понимаю как…
а вы мне про подумай и угадай где оно выводится.
Ну вернее я мог не так выразить свою мысль.
Картинка из превьюшки грузится в большую на javascript.
Логично, что если ты убираешь адрес картинки (размером [[+360x450]]) — то она не подставится в большую, при загрузке страницы, или клике.
Смотри, как работает javascript галереи и отключай его, если не нужен.
Логично, что если ты убираешь адрес картинки (размером [[+360x450]]) — то она не подставится в большую, при загрузке страницы, или клике.
Смотри, как работает javascript галереи и отключай его, если не нужен.
а если обновлю минишоп то все пропадет же?
легко сказать, да многие не знают javascript
вот только сейчас прикручивал, все пашет.
tpl.msGallery.row1
tpl.msGallery.row1
<li class="span2">
<a href='[[+url]]' class='cloud-zoom-gallery thumbnail' rel="useZoom: 'zoom1', smallImage: '[[+360x270]]'" data-image="[[+url]]">
<img src="[[+120x90]]" alt = "" title="[[+name]]" width="120" height="90"/></a>
</li>
tpl.msGallery.outer1<link href="assets/components/minifyx/zoom/cloud-zoom.css" rel="stylesheet" type="text/css" />
<script src="assets/components/minifyx/jquery-1.8.2.min.js"></script>
<script type="text/JavaScript" src="assets/components/minifyx/zoom/cloud-zoom.1.0.2.js"></script>
<div id="msGallery">
<a href='[[++assets_url]]components/minishop2/img/web/ms2_big.png' class='cloud-zoom' id='zoom1' rel="adjustX: 10, adjustY:-4, softFocus:true">
<img src="[[++assets_url]]components/minishop2/img/web/ms2_medium.png" width="360" height="270" title="" id="mainImage"/>
</a>
<ul class="thumbnails">
[[+rows]]
</ul>
</div>
а откуда скачивали cloud-zoom? дайте ссылку пожалуйста
ок спасибо
Боже мой… Оно еще и денег стоит?))) я и не знал...(((
А free аналоги есть?
А free аналоги есть?
Есть. Тот, что ставил я.
то как решили на этом оставаться что сделали?
Скажи пж, как сделать чтоб дефолтная картинка не показывалась
хочу добавить вот эту лупу
в чанки tpl.msGallery.outer пишу:
В чем моя ощибка?
в чанки tpl.msGallery.outer пишу:
<div id="msGallery">
<a rel="fancybox" href="[[++assets_url]]components/minishop2/img/web/ms2_big.png" target="_blank">
<img class = "my-foto" src = "[[++assets_url]] components/minishop2/img/web/ms2_medium.png" width = "360" height = "270" alt = "" title = "" id = "mainImage"
data-large = "[[++assets_url]] components/minishop2/img/web/ms2_big.png" />
</ a>
<ul class="thumbnails">
[[+rows]]
</ul>
</div>
Лупа работает, но на увеличенном фото показывается стандартная картинка minishop. Если посмотреть в код страницы то в атрибуте data-large находится: / assets/components/minishop2/img/web/ms2_big.pngВ чем моя ощибка?
Скорее всего дело в том, что стандартный скрипт галереи не подозревает о том, что ему еще нужно поменять путь в data-large, поэтому там и остается путь к дефолтной картинке.
Есть еще такое решение http://okfoc.us/okzoom/
Вот очень похожее БЕСПЛАТНОЕ и функциональное решение: http://zoomsl.sergeland.ru
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.