Карусель дополнительных фотографий

[fjeka]

Сделал все по инструкции. У меня правда версия 1.5.1.3. Под эту версию можно оптимизировать?

[Rustem]

Так там нечего оптимизировать, просто делаете под свою структуру, соблюдая логику и все, это же не модуль)

Все будет именно так, как у вас на сайте, только дополнительные изображения превратятся в красивую карусельку вместо того, чтобы расползаться по странице.

Если у вас fancybox, то там и будет всплывать fancybox при нажатии на картинку)

[veron]

2:Rustem

Все как ты написал, но получилась вот такая интересная картинка на maxystore opencart 1.5.4.1.

На удивление даже твой css с сайта не помог :(. Помогите, пожалуйста, кто-нибудь сделать как у Rustem'a :oops:

P.S: Rustem, напиши в ЛС кто делал верстку/дизайн, если не секрет :-)

[pshinchik]

Ребята подскажите, если к примеру у меня одна фотка или 2-е или 3-и как сделать чтоб стрелки не отображались, а только отображались стрелки когда больше 3-х фоток??????

[Ilya]

Супер!

[Talina]

Делаем горизонтальную карусельку для товаров.

Ее можно воткнуть в любой модуль или использовать для дополнительных товаров.

Ссылка на результат в версии 1.5.4.1 сборки Maxystore не открывается... Кто-то еще пробовал, этот фокус пройдет?

[Tom]

Подтверждаю! Встало идеально на три разных шаблона + дефолт)

[AlexFisher]

Как-то ставала задача именно такую карусель сделать из то-ли "последних", то-ли "рекомендуемых.

Использовал jcarusell и не жужжал. Единственное, что стили, как мне показалось, неудобно правятся.

Зато библиотека поддерживает кучу всяких вкусняшек. Свайпы, например, подключил двумя словами ;)

Жаль, этой темы еще не существовало. Меньше-б времени ушло =)

[AlexFisher]

Если пригодится, то вот выкопал для последних шаблон. Думаю, там понятно, что еще подключить.

<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jcarousel/skins/tango/skin.css" />
<script type="text/javascript" src="catalog/view/javascript/jcarousel/lib/jquery.jcarousel.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jcarousel/jquery.mousewheel.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jcarousel/jquery.touchwipe.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#latestcarousel').jcarousel({
scroll: 1,
visible: 6,
auto: 0,
rtl: false,
wrap: 'circular'
});

$("#latestcarousel").mousewheel(function(event, delta) {
if (delta < 0)
$(".jcarousel-next").click();
else if (delta > 0)
$(".jcarousel-prev").click();
return false; // prevent default
});

$("#latestcarousel").touchwipe({
 wipeLeft: function() {
	$(".jcarousel-next").click();
 },
 wipeRight: function() {
  $(".jcarousel-prev").click();
 },
 //wipeUp: function() { alert("up"); },
 //wipeDown: function() { alert("down"); },
 min_move_x: 200,
 min_move_y: 200,
 preventDefaultEvents: true
});
});
</script>

<div>
 <div>
<div class="box-product">
	<ul id="latestcarousel" class="jcarousel-skin-tango">
	<?php foreach ($products as $product) { ?>
	<li class="carousel-latest">
		<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" /></a></div>
<!--			<div class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></div>
-->		
		<div class="price">
<div style="width:128px;">
<div id="tot_div">
<!--				<?php if (!$product['special']) { ?>
-->
		<?php echo $product['price']; ?>
</div>
<div id="to_cart"> onclick="addToCart('<?php echo $product['product_id']; ?>');"></div>
</div>
<!--			<?php } else { ?>
		<span class="price-old"><?php echo $product['price']; ?></span> <span class="price-new"><?php echo $product['special']; ?></span>
		<?php } ?>
<?php if ($product['rating']) { ?>
	<div class="rating"><img src="catalog/view/theme/default/image/stars-<?php echo $product['rating']; ?>.png" alt="<?php echo $product['reviews']; ?>" /></div>
	<?php } ?>-->
<!-- <div class="cart"><input type="button" value="<?php echo $button_cart; ?>" onclick="addToCart('<?php echo $product['product_id']; ?>');" class="button" /></div>
-->		 </div>

	</li>
	<?php } ?>
	</ul>
</div>
 </div>
</div>

Ну и он под заказчика тему. Хотя, если заморачиваться, то нормально. Рабочий вариант.

[xxBRATxx]

Каруселька получилась, только на 1.5.4.1 центральная т.е. основная картинка не отображается. Выводятся только дополнительные.

[Tom]

Каруселька получилась, только на 1.5.4.1 центральная т.е. основная картинка не отображается. Выводятся только дополнительные.

 А это сделал ?

 

https://opencartforum.com/topic/11477-karusel-dopolnitelnykh-fotografii/?do=findComment&comment=111722

[xxBRATxx]

 А это сделал ?

 

https://opencartforum.com/topic/11477-karusel-dopolnitelnykh-fotografii/?do=findComment&comment=111722

всю тему прочитал. Tom, это тоже пробовал...

[xxBRATxx]

Извините, меня за панику =) сам виноват.

Указал не верный путь к стилям =) Все работает - красатища =)

[xxBRATxx]

=) еще раз извините, а как сделать вертикально т.к. я вижу в стилях есть вертикальная позиция, но понять не могу как ее указать?

[tim21701]

Дальнейшее обсуждение здесь;

https://opencartforum.com/topic/19527-prokrutka-dop-izobrazhenii-na-stranitce-tovara-how-to/

Тема закрыта.