Фото Модификаций Под Карточкой В Каталоге
#1
Отправлено 22 Декабрь 2016 - 08:59
#2
Отправлено 23 Декабрь 2016 - 14:47
Mari-ina (22 Декабрь 2016 - 08:59) писал:
</div> {% ENDIF %} </div> <div class="item-info">после вставьте
<div class="thumblist-box_catalog" {% FOR images %}{% IF goods.images.length <= 1 %}style="display:none;"{% ENDIF %}{% ENDFOR %}> <span class="prev"><i class="fa fa-angle-left"></i></span> <span class="next"><i class="fa fa-angle-right"></i></span> <!-- Другие изображения товара. Отображаются если есть изображения товара --> {% IFNOT goods.images.empty %} <ul id="thumblist_catalog" class="thumblist_catalog popup-gallery"> {% FOR images %} {% IFNOT goods.images.first %} <li><a href="{goods.images.LARGE}" title="{goods.images.NAME}" class="thumblisticon"><img src="{goods.images.ICON}" alt="{goods.images.NAME}" class="goods-image-icon" itemprop="image" /></a></li> {% ENDIF %} {% ENDFOR %} </ul> {% ENDIF %} </div><!-- END другие изображение товара -->
в конец файла main.js добавьте
// Другие изображение товара $(document).ready(function(){ $('.item-inner').each(function(){ $(this).find('.thumblist_catalog').carouFredSel({ prev : $(this).find(".thumblist-box_catalog .prev"), next : $(this).find(".thumblist-box_catalog .next"), auto : false, padding: [0, 20], swipe : { onMouse : false, onTouch : true } }).parents('.thumblist-box_catalog').removeClass('load'); }) });
далее найдите в файле main.css
.thumblist-box .thumblist li {display: block;float: left;margin: 0 15px 10px;} .thumblist-box .thumblist li a {display: table-cell;vertical-align: middle;height: 100px;width: 100px;text-align: center;}
после вставьте
.thumblist-box_catalog {margin: 25px 0 0;padding: 0;position: relative;} .thumblist-box_catalog .next, .thumblist-box_catalog .prev {position: absolute;top: 50%;margin-top: -13px;width: 26px;height: 26px;line-height: 24px;overflow: hidden;border: 1px solid #505050;border-radius: 50%;text-align: center;color: #FF5722;background: transparent;z-index: 10;cursor: pointer;} .thumblist-box_catalog .next:hover, .thumblist-box_catalog .prev:hover {background: #707070;border: 1px solid #707070;} .thumblist-box_catalog .prev {left: 0px;} .thumblist-box_catalog .next {right: 0px;} .thumblist-box_catalog .thumblist_catalog li {display: block;float: left;margin: 0 10px 10px;} .thumblist-box_catalog .thumblist_catalog li a {display: table-cell;vertical-align: middle;width: 45px;text-align: center;}
#3
Отправлено 23 Декабрь 2016 - 18:47
23.12.2016 18:28:39.
Сейчас все убрала. Во-первых, нужно сделать одинаковый размер фото (50*50 px приблизительно). 2. Карусель не работает. 3. Показываются все фото, имеющиеся у товара, а нужно чтобы было видно один ряд с 4 фотографиями и нормально пролистывалась карусель. 4. Из-за разного количества фотографий сломались все ряды с товарами. Нужно чтобы было выравнивание по нижнему краю товара с фото#4
Отправлено 28 Декабрь 2016 - 16:10
#5
Отправлено 09 Январь 2017 - 16:40
Mari-ina (28 Декабрь 2016 - 16:10) писал:
Что касаемо приведеной выше инструкции, то при ее установке происходит пролиистывание фотографий. Не совсем понятно что Вы имеете ввиду
Цитата
#6
Отправлено 11 Январь 2017 - 08:40
#8
Отправлено 19 Январь 2017 - 13:31
#10
Отправлено 19 Январь 2017 - 13:39
#11
Отправлено 22 Январь 2017 - 08:46
#12
Отправлено 24 Январь 2017 - 11:23
Mari-ina (22 Январь 2017 - 08:46) писал:
$(function(){ var $container = $('.product-grid, .product-list'); var lastPage = 1; // Скрываем навигацию по умолчанию $('.pagination').hide(); $container.infinitescroll({ navSelector : '.infinitescroll-pages', // класс элемента постраничной навигации для бесконечного скрола nextSelector : '.infinitescroll-pages b + a', // класс элемента постраничной навигации, ссылка на следующую страницу itemSelector : '.item', // класс элементов, которые будем извлекать loading: { msgText: 'Пожалуйста подождите...', finishedMsg: 'Больше нет товаров.', img: zoomloaderPath ? zoomloaderPath : '/zoomloader.gif' } }, function(newElements) { var $newElems = $( newElements ).css({ opacity: 1 }); lastPage++; // если это последняя страница, завершаем работу if(lastPage >= (infiniteScrollLastPage ? infiniteScrollLastPage : 1) ){ $container.infinitescroll('pause'); } } ); });
замените на
$(function(){ var $container = $('.product-grid, .product-list'); var lastPage = 1; // Скрываем навигацию по умолчанию $('.pagination').hide(); $container.infinitescroll({ navSelector : '.infinitescroll-pages', // класс элемента постраничной навигации для бесконечного скрола nextSelector : '.infinitescroll-pages b + a', // класс элемента постраничной навигации, ссылка на следующую страницу itemSelector : '.item', // класс элементов, которые будем извлекать loading: { msgText: 'Пожалуйста подождите...', finishedMsg: 'Больше нет товаров.', img: zoomloaderPath ? zoomloaderPath : '/zoomloader.gif' } }, function(newElements) { var $newElems = $( newElements ).css({ opacity: 1 }); lastPage++; // если это последняя страница, завершаем работу if(lastPage >= (infiniteScrollLastPage ? infiniteScrollLastPage : 1) ){ $container.infinitescroll('pause'); $(document).ready(function(){ previewInit(); // Добавление товара в корзину $('#wrapper').on('click', '.add-cart', function() { var form = $(this).closest('form'); if ($(this).hasClass('quick')) { form.attr('rel', 'quick'); } else { var rel = form.attr('rel'); if (rel) { form.attr('rel', rel.replace('quick', '')); } } form.trigger('submit'); return (false); }) }); } } ); });
#13
Отправлено 24 Январь 2017 - 13:44
#15
Отправлено 10 Декабрь 2017 - 12:14
Pogranets (05 Декабрь 2017 - 11:25) писал:
Здравствуйте.
В шаблоне main.css найдите код:
.block-menu-content ul li a.active {color: #fff;}
Замените на:
.block-menu-content ul li a.active {color: #000;}
Так же найдите код:
.view-mode span {color: #fff;}
Замените на:
.view-mode span {color: #000;}
И найдите код:
.header-tools .myaccount:hover .fa-user, .header-tools .mycart:hover .fa-shopping-cart .header-tools .mycompare:hover .fa-retweet {color: #fff;}
Замените на:
.header-tools .myaccount:hover .fa-user, .header-tools .mycart:hover .fa-shopping-cart .header-tools .mycompare:hover .fa-retweet {color: #000;}
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных