Image Effects
This is the original picture

Faded edges

Black and white

Blurred

Transparent

Resized image

Upside-down

Mirror

Frame

mouse-over effects
From faded to colored
.gradualshine{ filter:alpha(opacity=30); -moz-opacity:0.3; }
/*********************************************** * Gradual Highlight image script- � Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code ***********************************************/
var baseopacity=30
function slowhigh(which2){ imgobj=which2 browserdetect=which2.filters? "ie" : typeof which2.style.MozOpacity=="string"? "mozilla" : "" instantset(baseopacity) highlighting=setInterval("gradualfade(imgobj)",50) }
function slowlow(which2){ cleartimer() instantset(baseopacity) }
function instantset(degree){ if (browserdetect=="mozilla") imgobj.style.MozOpacity=degree/100 else if (browserdetect=="ie") imgobj.filters.alpha.opacity=degree }
function cleartimer(){ if (window.highlighting) clearInterval(highlighting) }
function gradualfade(cur2){ if (browserdetect=="mozilla" && cur2.style.MozOpacity<1) cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99) else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100) cur2.filters.alpha.opacity+=10 else if (window.highlighting) clearInterval(highlighting) }

.gradualshine{ filter:alpha(opacity=30); -moz-opacity:0.3; }
/*********************************************** * Gradual Highlight image script- � Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code ***********************************************/
var baseopacity=30
function slowhigh(which2){ imgobj=which2 browserdetect=which2.filters? "ie" : typeof which2.style.MozOpacity=="string"? "mozilla" : "" instantset(baseopacity) highlighting=setInterval("gradualfade(imgobj)",50) }
function slowlow(which2){ cleartimer() instantset(baseopacity) }
function instantset(degree){ if (browserdetect=="mozilla") imgobj.style.MozOpacity=degree/100 else if (browserdetect=="ie") imgobj.filters.alpha.opacity=degree }
function cleartimer(){ if (window.highlighting) clearInterval(highlighting) }
function gradualfade(cur2){ if (browserdetect=="mozilla" && cur2.style.MozOpacity<1) cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99) else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100) cur2.filters.alpha.opacity+=10 else if (window.highlighting) clearInterval(highlighting) }
From gray to colored

Spotlight

//Image spotlight effect- By Erik F (die_schlampe@hotmail.com) //Code enhancements by Dynamicdrive.com //Visit http://www.dynamicdrive.com for this script
s = 50; // the size of the spotlight vp = 10; // the visibility percent of the picture startx = 0; // the top position of your sportlight into the image (on start) starty = 0; // the left position of your spotlight into the image (on start)
////////////////////////////////////////////////////////////////// // No need to edit below this line // //////////////////////////////////////////////////////////////////
var IE = document.all?true:false
function moveL() { xv = tempX; yv = tempY; myimage.filters.light.MoveLight(1,xv,yv,s,true); }
if (IE&&myimage.filters) document.all.myimage.onmousemove = getMouseXY; var tempX = 0 var tempY = 0
function getMouseXY(e) { tempX = event.offsetX tempY = event.offsetY
if (tempX < 0){tempX = 0} if (tempY < 0){tempY = 0} if (t) { moveL(); }
return true }
var xv = startx; var yv = starty; var t= true; if (IE&&myimage.filters){ myimage.style.cursor="hand"; myimage.filters.light.addAmbient(255,255,255,vp) myimage.filters.light.addPoint(startx,starty,s,255,255,255,255) }
//Image spotlight effect- By Erik F (die_schlampe@hotmail.com) //Code enhancements by Dynamicdrive.com //Visit http://www.dynamicdrive.com for this script
s = 50; // the size of the spotlight vp = 10; // the visibility percent of the picture startx = 0; // the top position of your sportlight into the image (on start) starty = 0; // the left position of your spotlight into the image (on start)
////////////////////////////////////////////////////////////////// // No need to edit below this line // //////////////////////////////////////////////////////////////////
var IE = document.all?true:false
function moveL() { xv = tempX; yv = tempY; myimage.filters.light.MoveLight(1,xv,yv,s,true); }
if (IE&&myimage.filters) document.all.myimage.onmousemove = getMouseXY; var tempX = 0 var tempY = 0
function getMouseXY(e) { tempX = event.offsetX tempY = event.offsetY
if (tempX < 0){tempX = 0} if (tempY < 0){tempY = 0} if (t) { moveL(); }
return true }
var xv = startx; var yv = starty; var t= true; if (IE&&myimage.filters){ myimage.style.cursor="hand"; myimage.filters.light.addAmbient(255,255,255,vp) myimage.filters.light.addPoint(startx,starty,s,255,255,255,255) }
Drag picture around
