LightSlider вместо FancyBox

[drakulitkas]

Приветствую,

Подскажите пожалуйста как обернуть код этим слайдером с миниатюрами?

Хотел сделать в product.tpl вместо стандартного FancyBox - не получается.

 

 

HTML

<ul id="vertical">
  <li data-thumb="img/thumb/cS-1.jpg">
    <img src="img/cS-1.jpg" /></li>
  <li data-thumb="img/thumb/cS-2.jpg">
    <img src="img/cS-2.jpg" /></li>
</ul>

Вот скрипт для него в варианте "Vertical":

 $(document).ready(function() {
    $('#vertical').lightSlider({
      gallery:true,
      item:1,
      vertical:true,
      verticalHeight:295,
      vThumbWidth:50,
      thumbItem:8,
      thumbMargin:4,
      slideMargin:0
    });  
  });

Исходники:

http://sachinchoolur.github.io/lightslider/examples.html

[svma3x]

Доброго времени суток - что именно не получается? Проверьте версию jQuery

[drakulitkas]

Не получается обернуть его этим кодом:

 

{if $product->image}
 <div class="image">
  <a href="{$product->image->filename|resize:800:600:w}" class="zoom" rel="group"><img src="{$product->image->filename|resize:300:300}" alt="{$product->product->name|escape}" /></a>
 </div>
{/if}

и для миниатюр:

 

{if $product->images|count>1}
 <div class="images">
  {* cut удаляет первую фотографию, если нужно начать 2-й - пишем cut:2 и тд *}
   {foreach $product->images|cut as $i=>$image}
    <a href="{$image->filename|resize:800:600:w}" class="zoom" rel="group"><img src="{$image->filename|resize:95:95}" alt="{$product->name|escape}" /></a>
   {/foreach}
 </div>
{/if}

 

[Kosjak76]

<ul id="imageGallery">
{foreach $product->images as $i=>$image}
  <li data-thumb="{$image->filename|resize:95:95}" data-src="{$image->filename|resize:800:600:w}">
    <img src="{$image->filename|resize:95:95}" />
  </li>
   {/foreach}
</ul>

Типа такого код должен быть.

[drakulitkas]

 

<ul id="imageGallery">
{foreach $product->images as $i=>$image}
  <li data-thumb="{$image->filename|resize:95:95}" data-src="{$image->filename|resize:800:600:w}">
    <img src="{$image->filename|resize:95:95}" />
  </li>
   {/foreach}
</ul>

Типа такого код должен быть.

 

Спасибо Косяк, оно самое!!! Большой +!!!

 

ps: не знал что ты модератор, а когда назначили?

[Kosjak76]

Давно уже