Slider for additional thumbnail pictures

[rzrz]

Hi I wanna achieve this effect here, the closest I can find is on this thread but sadly its VM1+

I am using jCarouselLite

These are my steps of modification:

1) Call the script at productdetails/default.php's header

Code Select Expand

$document->addScript(JURI::root().VmConfig::get('assets_general_path').'js/flexi/additional-slider.js');


2) Call the function in productdetails/deafult_images.php after <div class="additional-images">

Code Select Expand

    <script type="text/javascript">
$(document).ready(function() {
$(".widget_style").jCarouselLite({
btnPrev: ".previous",
btnNext: ".next",
/*this makes it a true carousel rather than a slideshow*/
circular: true
});
});

$(".carousel").jCarouselLite({
     btnNext: ".next",
     btnPrev: ".prev"
});

$(".carousel").jCarouselLite({
     btnNext: ".next",
     btnPrev: ".prev",
     btnGo: [".0", ".1", ".2"]
});
</script>   


3) Put the html in after the script above
       

Code Select Expand

<?php 
 if($this->product->images[0]->virtuemart_media_id!=0 && count($this->product->images)>0)  {
     echo "<ul>";
 foreach($this->product->images as $a=>$b){
  $imgsrc = JURI::root().$b->file_url;
  $imgsrc_thumb = JURI::root().$b->file_url_thumb;   
  echo "<li><a href=\"".$imgsrc."\"><img src=\"".$imgsrc_thumb."\" ref=\"".$imgsrc."\"/></a></li>";  
 }
 echo "</ul>";
 }
     ?>

But it doesn't work! I think something I am missing in the HTML part.. Can anybody help?

[jjk]

If you can live without the zoom effect (which is only a cropped full image), VirtueMart 2.0.16 makes use of the fancybox previous/next image buttons by default. Earlier versions of VirtueMart are using facebox in the frontend.

[rzrz]

Sadly I can't, its a requirement by my client 

Also the previous/next buttons are on the pop up, not on the thumbnails in 2.0.16

If you can live without the zoom effect (which is only a cropped full image), VirtueMart 2.0.16 makes use of the fancybox previous/next image buttons by default. Earlier versions of VirtueMart are using facebox in the frontend.

[rzrz]

Found a nifty extension!

http://www.magictoolbox.com/magiczoomplus/modules/virtuemart/