COVID2019 и это вот все. Друзья, вся эта история начинает плохо пахнет. Мойте руки, не ходите в люди. Отложите все плановые покупки и положите в носок заначку. Заприте ваших родителей, бабушек-дедушек на даче. Лучше перебдеть чем недобдеть. Берегите себя!
Поиск по сайту
Результаты поиска по тегам 'карусель'.
Найдено 2 результата
-
В стандартном шаблоне Opencart 2 дополнительные изображения товаров выводятся без скрола (карусели), захотелось решить. На досуге занимался, код кривой, работает под дефолтной схемой, но может быть кому-то пригодится. Пример получившегося во вложении. 1) \catalog\controller\product\product.php где-нибудь после $this->document->addStyle('catalog/view/javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.css'); добавляем $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.carousel.css'); $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.min.js'); 2) \catalog\view\theme\default\template\product\product.tpl 2.1) в начало файла <style> #owl-demo .item{ padding: 1px 1px; margin: 1px; color: #FFF; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; } .customNavigation{ text-align: center; } .customNavigation a{ -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .owl-carousel .owl-buttons .owl-prev{ left:1px !important; opacity: 0.4 !important; } .owl-carousel .owl-buttons .owl-next{ right:1px !important; opacity: 0.4 !important; } .owl-carousel:hover .owl-buttons div{ opacity:0.7 !important; } </style> 2.2 в конец, в скрипты $(document).ready(function() { var owl = $("#owl-demo"); owl.owlCarousel({ items : 3, itemsDesktop : [1000,3], itemsDesktopSmall : [900,3], itemsTablet: [600,2], itemsMobile : false, navigation : true, navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'], pagination: false }); }); 2.3 вывод дополнительных картинок <?php if ($images) { ?> <?php foreach ($images as $image) { ?> <li class="image-additional"><a class="thumbnail" href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>"> <img src="<?php echo $image['thumb']; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li> <?php } ?> <?php } ?> меняем на <?php if ($images) { ?> <div id="owl-demo" class="owl-carousel owl-theme"> <?php foreach ($images as $image) { ?> <div class="item"> <a href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>" class="colorbox"><img src="<?php echo $image['thumb']; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a> </div> <?php } ?> </div> <?php } ?>
-
Возникла необходимость (скорее желание) вставить карусель с производителями в верхнюю часть сайта (в одну строку с верхним меню) как это проще реализовать? что необходимо вставить в файл catalog/view/theme/kitchen/template/common/header.tpl чтобы отображалась карусель с производителями (брендами)? Наверное лучший вариант был бы с увеличением мес где можно вставлять карусель, обозвать его скажем - "верхнее меню"