Page 1 of 1
Swap - swap main image AND thumbnail Will Pay
Posted: 01 Dec 2010, 01:35
by ronniestamps
Using the swap image setting, I've styled the gallery like this:
http://stilifecreative.com/index.php?op ... id=4:print
I would like all thumbnails to be a gray box using either an image I have created or css #CCCCCC until you hover over it and it reveals the actual thumbnail and stays that way unless the page is reloaded or revisited... starting with all gray boxes again.
I've approached this using javascript and css with no luck. I have experience in both but am not an expert. I believe the issue that I am running into is that the thumbnails do not have a unique id that is generated within the image tags. I also think I may be over thinking this task. Any insight would be absolutely awesome.
Thank you in advance.
Joomla - 1.5.20
Phoca Gallery - 2.7.5
Re: Swap - swap main image AND thumbnail
Posted: 01 Dec 2010, 20:57
by Jan
Hi, no experiences, really no idea if this can be only by CSS, I think for this you need to use some javascript
Jan
Re: Swap - swap main image AND thumbnail
Posted: 02 Dec 2010, 21:14
by ronniestamps
I'm 99% positive it CAN NOT be done with css, as the thumbnails are created by dumping an array into the jhtml image function. I am OK with using Javascript for this function. I've gotten really close, but need expert advice/help. My mention of css was only to show what I've tried so far.
Thank you for your input, any more would be greatly appreciated.
TIA - Ronnie
Re: Swap - swap main image AND thumbnail
Posted: 04 Dec 2010, 21:01
by ronniestamps
@Jan - More than happy to make a more than minimum donation if you can solve this for me.
Re: Swap - swap main image AND thumbnail
Posted: 06 Dec 2010, 23:49
by Jan
Hi, will be great but I have really no experiences with such feature and in fact I am not javascript expert
for me this is the same problem like for you
Re: Swap - swap main image AND thumbnail
Posted: 07 Dec 2010, 03:29
by ronniestamps
Anyone else? Willing to pay.
Swap - swap main image AND thumbnail Will Pay
Posted: 07 Dec 2010, 06:17
by ronniestamps
Figured it out, will post code later.
Re: Swap - swap main image AND thumbnail Will Pay
Posted: 07 Dec 2010, 12:30
by Jan
Ok
Re: Swap - swap main image AND thumbnail Will Pay
Posted: 10 Dec 2010, 20:40
by ronniestamps
For swap image setting only. Should work in other situations but you would need to place the following code in different areas.
Open file components/com_phocagallery/views/category/tmpl/default.php
Each dynamically created thumbnail needs a unique name so the javascript knows which thumbnail is being hovered over. So...
declare a variable and assign it a value of 0:
add your javascript to the code that generates the thumbnails:
Code: Select all
onMouseOut="document.a'.$imgids.'.src=\'http://stilifecreative.com/images/clear_thumb.gif\';"
so that the entire echo command looks like:
Code: Select all
echo ' onmouseover="PhocaGallerySwitchImage(\'PhocaGalleryobjectPicture\', \''. $switchImg.'\');displayDescription(\''.$value->description .'\');" onMouseOut="document.a'.$imgids.'.src=\'http://stilifecreative.com/images/clear_thumb.gif\';"';
this variable needs to auto-increment so add the following code on the line above the echo command you just modified:
Needs to be after
and before the echo command above.
add this line:
Code: Select all
echo '<img name="a'.$imgids.'" src="http://stilifecreative.com/images/grey_thumb.gif" class="pg-img-ovr1" />';
after this line:
Code: Select all
echo JHTML::_( 'image.site', $value->linkthumbnailpath, '', '', '', $value->altvalue);
fyi: clear_thumb.gif and grey_thumb.gif are the images I am using for the swap.
Hope this helps someone out in the future.
Re: Swap - swap main image AND thumbnail Will Pay
Posted: 12 Dec 2010, 00:39
by Jan
Great, thank you for this guide.
Jan