Legosp Forum
Shop-Script "Legosp" => Разработка => Тема начата: lugobor от Апреля 12, 2012, 01:07:38 pm
-
Прикрутил лупу отсюда http://pcvector.net/scripts/image-effects/7-effekt-lupy-na-izobrazhenii-zoomy.html (http://pcvector.net/scripts/image-effects/7-effekt-lupy-na-izobrazhenii-zoomy.html)
На денвере все работает, на сервере не хочет :(
Сделал так
в файл css/тема/stylesheet/stylesheet.css добавил
/*Лупа*/
.zoomy{
position: absolute;
display: none;
background-repeat: no-repeat;
-webkit-box-shadow: 3px 3px 10px #000;
-moz-box-shadow: 3px 3px 10px #000;
border: 0;
cursor: url(../image/blank.gif), move;
line-height: 100px;
text-align: center;
background-image: url(../image/loading.gif);
background-position: center;
background-color: #fff;
z-index: 1000;
}
.zoomy span{
display: block;
margin: 10px auto;
background:-webkit-gradient(linear, 0% 100%, 0% 0%, color-stop(0.50, rgba(255, 255, 255, 0)), to( rgba(255, 255, 255, .5)));
background:-moz-linear-gradient(bottom center, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, .5) 100%);
}
.zoomy img{
opacity: 0;
filter:alpha(opacity=0);
}
.zoomy a{
color: #333;
text-decoration: none;
}
.broke a{
display: block;
height: 100%;
width: 100%;
}
#brokeZoomy{
display: block;
position: absolute;
width: 30px;
height: 30px;
top: 0px;
left: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
background: #fff url(../image/broke.gif) center no-repeat;
}
Залил картинки для лупы в папку css/тема/image/
залил jquery.zoomy0.5.min.js в core/js
в файле css/тема/theme/head.tpl.html
перед </head> добавил
<script type="text/javascript" src="./core/js/jquery.zoomy0.5.min.js."></script>
и в css/тема/theme/product_detailed.tpl.html в
<a href="./products_pictures/{if $p_default}{$p_default}-B.jpg{else}{$product_info[9]}{/if}" class="thickbox" id="adpdp{$product_info[11]}"><img src="./products_pictures/{if $p_default}{$p_default}.jpg{else}{$product_info[5]}{/if}" id="dp{$product_info[11]}" style="margin-bottom: 3px;" alt="{$product_info[1]}" /></a>
поменял class="thickbox" на class="zoom"
<a href="./products_pictures/{if $p_default}{$p_default}-B.jpg{else}{$product_info[9]}{/if}" class="zoom" id="adpdp{$product_info[11]}"><img src="./products_pictures/{if $p_default}{$p_default}.jpg{else}{$product_info[5]}{/if}" id="dp{$product_info[11]}" style="margin-bottom: 3px;" alt="{$product_info[1]}" /></a>и в самом низу вставил
<script type="text/javascript">
$(function(){
$('.zoom').zoomy();
});
</script>
Где ошибся?
Куда копать? :)
-
Прикрутил еще сюда http://sofi.cc.ua/product/byustgalter-1224-lupoline-168/ (http://sofi.cc.ua/product/byustgalter-1224-lupoline-168/)
-
Reload the page to get source for: http://lugobor31.cc.ua/core/js/jquery.zoomy0.5.min.js
сверть права на фаил выставте такиеже как и на jquery.nivo.slider.pack.js
оба 644
-
;D Ура!!! заработало!!! Спасибо!!!
-
Собрал все воедино во вложении
[вложение удалено администратором]
-
Лупа конфликтует с перелетом в корзину
http://dudkov.ua/product/unikub-2/
Как их помирить?
-
Поправил, не помогло...
-
Поправил, не помогло...
ни вижу блок с id='module_cart'.
-
Поправил, не помогло...
Тут такая же ситуация
в категории полет нормальный http://sofi.cc.ua/catalog/dlya-domashnego-otdyha/
а в подробно улетает где-то снизу http://sofi.cc.ua/product/pizhama-p-201-lupoline-10/
-
Поправил, не помогло...
Тут такая же ситуация
в категории полет нормальный http://sofi.cc.ua/catalog/dlya-domashnego-otdyha/
а в подробно улетает где-то снизу http://sofi.cc.ua/product/pizhama-p-201-lupoline-10/
это и за position в классе .zoomy
-
это и за position в классе .zoomy
Спасибо за наводку. Решил не заморачиваться, поменял местами фото и инфу. Полет удовлетворительный!
-
это и за position...
может даже это, <a id="adpdp..." class="zoom" ... style="position: relative; .....>
-
Лупа конфликтует с перелетом в корзину
http://dudkov.ua/product/unikub-2/
Как их помирить?
странно, через Хром если зайти все равно в корзину летит где то внизу товар..
и странная лупа получилась. На дополнительных фотографиях не работает.
Хорошая лупа и реализация дополнительные картинки сделаны ТУТ
http://www.focalprice.com/IP0359B/MultiPorts_Power_Station_and_Speaker_for_iPad12_iPhone_3G4_Black.html
Кто может так сделать?
цена вопроса для Lego4.6 и 5,02
в личку пожалуйста.
модуль лупы на ваше усмотрение..
Нужно:
1.чтобы дополнительные картинки выстраивались под главной
2. перелистывались дополнительные картинки стрелочками побокам
3. при наведении (без щелчка) на дополнительную картинку она становилась главной картинкой
4. при наведении на главную картинку справа появлялась лупа
5. не конфликтовал с корзиной и PrettyPhoto (или какой там модуль в 4.6 и 5,02)
6. желательно чтоб код был компактный и не грузил намного сильнее хост.
собственно работать должно точно так же как тут
http://www.focalprice.com/IP0359B/MultiPorts_Power_Station_and_Speaker_for_iPad12_iPhone_3G4_Black.html