VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: Tommi on November 08, 2012, 20:48:51 PM

Title: Product image in category - PopUp on mouseover
Post by: Tommi on November 08, 2012, 20:48:51 PM
I need advice: I want to display images in a category of products with mouseover function.
Does anyone have experience?
Title: Re: Product image in category - PopUp on mouseover
Post by: PRO on November 08, 2012, 21:10:40 PM
Quote from: Tommi on November 08, 2012, 20:48:51 PM
I need advice: I want to display images in a category of products with mouseover function.
Does anyone have experience?

what do you mean? dont display an image until they mouseover??
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 08, 2012, 21:15:47 PM
I need to display an image with mouseover  (no click on image) in products category and hide the image if I go with the mouse.
Title: Re: Product image in category - PopUp on mouseover
Post by: PRO on November 08, 2012, 21:40:04 PM
which image?
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 08, 2012, 21:48:10 PM
In category image.. example: http://www.goraslovakia.sk/index.php?option=com_virtuemart&view=category&virtuemart_category_id=95&Itemid=490 I must click for open big image, but I have open image on mouseover a hite, when I leave the mouse ...

[attachment cleanup by admin]
Title: Re: Product image in category - PopUp on mouseover
Post by: PRO on November 09, 2012, 22:17:48 PM
I do not know how to do this

BUT,

looking at your page, you should NOT leave "spaces" in your image names

for example
http://www.goraslovakia.sk/images/stories/virtuemart/product/misa%206%20grey%200001.jpg

the % sign is a space
Title: Re: Product image in category - PopUp on mouseover
Post by: Ventsi Genchev on November 11, 2012, 08:15:04 AM
Tommi, what do you mean? Something like what I did on my page?

http://www.vspc.bg/produkti/klaviaturi-i-mishki/mishki

To make it more convenient to consumers, I made a popup in many places.  :)
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 11, 2012, 08:23:09 AM
Hi Venci,
Yes, that's it! Please, help me?
Title: Re: Product image in category - PopUp on mouseover
Post by: bytelord on November 11, 2012, 22:18:35 PM
Hello Tommi,

Please take a look on that example: http://forum.virtuemart.net/index.php?topic=107126
You could easily make the same for category view.

Regards.
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 11, 2012, 22:20:05 PM
Yes, but I have a problem with height in Mozilla. Please check: http://www.goraslovakia.sk/index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=35&virtuemart_category_id=35&Itemid=490#thumb
Title: Re: Product image in category - PopUp on mouseover
Post by: bytelord on November 11, 2012, 22:40:39 PM
Hello,

Use firebug to examine your code & css styling: http://forum.virtuemart.net/index.php?topic=102850.0

This is caused by z-index and position inside your CSS files. Please check them and make some tests. May be your next element index is lower than the thumb

Regards
Title: Re: Product image in category - PopUp on mouseover
Post by: bytelord on November 11, 2012, 22:45:56 PM
Basically is caused by your joomla art template ....

inside layout.css @ line 17/18 there is a attribute

.column {

    overflow: hidden;

}

Delete or comment that overflow:hidden;

The overflow:hidden , just hides the content at the end of the column ... so there is no posibility to show the rest of the image cause the "space" end there...

Regards
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 11, 2012, 23:01:57 PM
Thank you!
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 14, 2012, 18:59:08 PM
I need to do something similar in category: http://www.goraslovakia.sk/index.php?option=com_virtuemart&view=productdetails&virtuemart_product_id=110&virtuemart_category_id=33&Itemid=490.
In the Category, http://www.goraslovakia.sk/index.php?option=com_virtuemart&view=category&virtuemart_category_id=33&Itemid=490  I want to display the image mouseover function.

Example: http://www.vspc.bg/produkti/klaviaturi-i-mishki/mishki

Is there any solution?
Title: Re: Product image in category - PopUp on mouseover
Post by: bytelord on November 14, 2012, 19:06:24 PM
Hello Tommi,

Just use the same code with the appropriate modifications to create a template override for the file components/com_virtuemart/views/category/tmpl/default.php.
That was the case from the start

Regards
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 14, 2012, 19:12:22 PM
It's also processed, but it does not work.

I need to process here:com_virtuemart/views/category/default.php - line 240.

<?php /** @todo make image popup */
                    echo $product->images[0]->displayMediaThumb ('class="browseProductImage" border="0" title="' . $product->product_name . '" ', TRUE, 'class="modal"');
?>

But I do not know. Once you enter the same code I get an error.

Can you help me?
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 15, 2012, 09:02:07 AM
Hi bytelord,
I Have a problem: When

<?php /** @todo make image popup */
                    echo $product->images[0]->displayMediaThumb ('class="browseProductImage" border="0" title="' . $product->product_name . '" ', TRUE, 'class="modal"');
?>

When you edit the code and add an image display, throws me an error.

echo '<span>' . $image->displayMediaFull('class="product-image"', false, 'class="modal"', true, true) . '</span>

Can you help me?

Thanks.
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 15, 2012, 09:08:09 AM
I added the code:

<?php /** @todo make image popup */
                    echo $product->images[0]->displayMediaThumb ('class="browseProductImage" border="0" title="' . $product->product_name . '" ', TRUE, 'class="modal"');
            
               echo '<a class="thumbnail" href="#thumb">' . $image->displayMediaThumb('class="product-image-medium"', false, 'class="modal" href="#thumb"', true, true) . ''; //'class="modal"'
      echo '<span>' . $image->displayMediaFull('class="product-image"', false, 'class="modal"', true, true) . '</span></a>';
     ?>

And errors is here: http://goraslovakia.tommi.sk/index.php?option=com_virtuemart&view=category&virtuemart_category_id=87&Itemid=490
Title: Re: Product image in category - PopUp on mouseover
Post by: bytelord on November 15, 2012, 19:54:21 PM
Hello,

Because you broke some PHP brackets. Place it at the right spot, but as i see you fixed it already.

Regards
Title: Re: Product image in category - PopUp on mouseover
Post by: Tommi on November 15, 2012, 20:53:54 PM
Yes, I did. Thanks for your help.

I have one problem, but I do not know whether it is solvable. Can you look at it?

http://forum.virtuemart.net/index.php?topic=110032.0