I need additional images in product page to swap with large image when clicked?

Started by lt635, January 13, 2012, 07:56:41 AM

Previous topic - Next topic

lt635

Hi,

In stead of having the additional images appear in a pop up box when clicked on does anybody know the solution to swap into the large image view when clicked?  And also having them float right of the large image instead at the bottom?

Thanks
Regards
Lene

breturi7

I'm curious to know the solution to this, as well, as mine are strictly modal.

PRO

The default product details package does this on  hover

If you notice here
https://dev.virtuemart.net/svn/virtuemart/trunk/virtuemart/components/com_virtuemart/views/productdetails/tmpl/default.php

The code is right there.

$('.additional-images a').mouseover(function() {
         var himg = this.href ;
         var extension=himg.substring(himg.lastIndexOf('.')+1);
         if (extension =='png' || extension =='jpg' || extension =='gif') {
            $('.main-image img').attr('src',himg );
         }
         console.log(extension)
      });*/
   });
");

breturi7

Thanks for pointing out the code. I've made sure my test products are set to the default product details view as well as double checked to make sure the hover code was there in the php file, but I'm still getting a modal popup instead of image scroll for those additional images. I'm not sure if something with my joomla template is conflicting with it or what. It's not a huge deal, just one of those little stylistic things I'd like to eventually figure out. Thanks for pointing me in the right direction.

rupesh

Quote from: BanquetTables.pro on March 13, 2012, 03:43:10 AM

$('.additional-images a').mouseover(function() {
         var himg = this.href ;
         var extension=himg.substring(himg.lastIndexOf('.')+1);
         if (extension =='png' || extension =='jpg' || extension =='gif') {
            $('.main-image img').attr('src',himg );
         }
         console.log(extension)
      });*/
   });
");


i also added same code in default.php using

Joomla Template Override is easy.So , to override the product details page. i have created YOUR_TEMPLATE/html/com_virtuemart/productdetails/default.php


but its doesn't effect!  please help me sir


[attachment cleanup by admin]

kregus

Thanks! I got the additional images working with the mousover effect! However, when I click the main image, it always opens the first image in a modal window, no matter which image is currently shown as main image.

What do I need to change to make the modal window show the correct main image?

Thanks in advance! This is one of the last problems I have to solve before my shop can go online, so you are a hero if you can help me with this!

Shapes

Hello Banquet Tables Pro,

Thanks for pointing those  code lines !
It works for me.

I would like to disable the click now that the mouseover shows the image,
is that possible ? Would you know how ?

I'm using latest Virtuemart version with Joomla 2.5.4.

Hoping for answers,
Best regards,
David aka Shapes