PDA

View Full Version : how to make this effect?

syun_ukiya
07-07-2003, 06:01 AM
http://rue.f2o.org/

the lighting effect on pics
burningstars
07-07-2003, 07:08 AM
Put this between your <head> and </head> tags:


<script>

/*
Gradual-Highlight Image Script II-
By J. Mark Birenbaum (birenbau@ugrad.cs.ualberta.ca)
Permission granted to Dynamicdrive.com to feature script in archive
For full source to script, visit http://dynamicdrive.com
*/

nereidFadeObjects = new Object();
nereidFadeTimers = new Object();

/* object - image to be faded (actual object, not name);
* destop - destination transparency level (ie 80, for mostly solid)
* rate - time in milliseconds between trasparency changes (best under 100)
* delta - amount of change each time (ie 5, for 5% change in transparency)
*/

function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){ //do this so I can take a string too
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}

clearTimeout(nereidFadeTimers[object.sourceIndex]);

diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;

if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}

</script>


and then when you place an image add this to it:

style="filter:alpha(opacity=25)" onmouseover="nereidFade(this,100,70,20)" onmouseout="nereidFade(this,20,50,10)" border="none"

it would look like this with that in it

<img src="whatever.gif/jpg/png" style="filter:alpha(opacity=25)" onmouseover="nereidFade(this,100,70,20)" onmouseout="nereidFade(this,20,50,10)" border="none">
syun_ukiya
07-07-2003, 10:51 AM
can the mouseout be adjusted to a bit brighter than the default?
burningstars
07-07-2003, 04:09 PM
yes you just change these numbers around

nereidFade(this,100,70,20)
nereidFade(this,20,50,10)


destop - destination transparency level (ie 80, for mostly solid)(the first number)
rate - time in milliseconds between trasparency changes (best under 100) (the second number)
delta - amount of change each time (ie 5, for 5% change in transparency) (the third number)

I just fooled around with those until I got the look i was going for!

you can also change "filter:alpha(opacity=25)" if you want to make it less visable when its not hovered over or more visable. the higher the number the higher the visability!