View Single Post
  #3  
Old 12-20-2006, 07:39 AM
austriaka's Avatar
austriaka+ Offline
Team Pixelpost
 
Join Date: Nov 2006
Location: Germany
Posts: 1,175
Send a message via ICQ to austriaka Send a message via AIM to austriaka
I did it here with a very simple JavaScript, you find my "digital darkroom secret" when moving the mouse over the little mouth beneath the bottom right corner of the image:
http://blog.uhlig.at
(no mouth, no secret)

The doing:

You have to create a little grafic for the "secret". Do it in two
different colors (in my site it is the mouth, in grey and red)
Use it like this:
The image which should have a secret to reveale must have a (unique)
name, IE:
<img src="123456789_001.jpg" name="mainimage">
(change that in image_template.html)
The "before"-images have the same name than the "after"-images, just type "o_" before the name.
IE:
after: 123456789_001.jpg
before: o_123456789_001.jpg

The HTML for the "Secret" grafic (just for understanding):
Code:
<a href="#"
onMouseover="
document.images['secret'].src='PATH TO HIGHLITE SECRET GRAFIC';
document.images['IMAGE NAME'].src='PATH TO BEFORE IMAGE'"
onMouseout="
document.images['secret'].src='PATH TO LOWLITE SECRET GRAFIC';
document.images['IMAGE NAME'].src='PATH TO IMAGE'"
onClick="return false;" title="Before Processing">
<img name="secret" src="PATH TO LOWLITE SECRET GRAFIC" border="0">
</a>
In {pixelpost_src}/index.php insert this in line 258:

Code:
// ############ SECRET ################ //
if (is_file('images/o_'.$image_name)) {
	$tpl = str_replace("<SECRET_LINK>",'<a href="#" onMouseover="document.images[\'secret\'].src=\'templates/light.my.dark-ger/img/secret.gif\'; document.images[\'maini\'].src=\'images/o_'.$image_name.'\'" onMouseout="document.images[\'secret\'].src=\'templates/light.my.dark-ger/img/secret_grey.gif\'; document.images[\'maini\'].src=\'images/'.$image_name.'\'" onClick="return false;" title="Digital Darkroom Secret"><img name="secret" src="templates/light.my.dark-ger/img/secret_grey.gif" border="0" align="right" /></a>',$tpl);
}
else {
	$tpl = str_replace("<SECRET_LINK>",'',$tpl);
}
In image_template.html put the new pixelpost tag <SECRET_LINK> wherever you want it to be shown.

If anybody is interested, I could do this as an addon, should be not very tricky
KArin
__________________
Uh!log Photoblog
My Addons

Last edited by austriaka; 12-20-2006 at 12:14 PM.
Reply With Quote