[MultiMediaRollovers]




Klicken Sie hier, um die Seite neu zu laden und neue Effekte zu erleben.

Dieses Script generiert Rollovers mit Transition- Filtereffekten.
Cool! Die Art des Effekts wird bei jedem erneuten Laden der Seite per Zufallsgenerator aus 23 möglichen Effekten ausgewählt.
Einschränkung: Die Transition- Effekte kommen nur bei IE richtig zur Geltung.

[Code]

[zwischen <HEAD> und </HEAD>]
<script type="text/javascript">
/**
  * You may use this code for free on any web page provided that
  * these comment lines and the following credit remain in the code.
  * Multimedia Rollovers from http://www.javascript-fx.com
  */
//Uncomment the next line for random transition rollover each time the page is loaded
document.write('<STYLE TYPE="text/css">.imgTrans{ filter:revealTrans(duration=1, transition='+Math.floor(Math.random()*23)+') }</STYLE>');

//Uncomment the next line for a specific transition rollover (transition=0 to 23)
//document.write('<STYLE TYPE="text/css">.imgTrans{ filter:revealTrans(duration=1,transition=2) }</STYLE>');

//Uncomment the next line for fading rollovers
//document.write('<STYLE TYPE="text/css">.imgTrans{ filter:blendTrans(duration=1) }</STYLE>');

var onImages=new Array();
function Rollover(imgName, imgSrc)
{
 onImages[imgName] = new Image();
 onImages[imgName].src = imgSrc;
}
function turnOn(imgName)
{
 if(document.images[imgName].filters != null)
  document.images[imgName].filters[0].stop();
 document.images[imgName].offSrc = document.images[imgName].src;
 document.images[imgName].src    = onImages[imgName].src;
}
function turnOff(imgName)
{
 if(document.images[imgName].filters != null)
  document.images[imgName].filters[0].apply();
 document.images[imgName].src = document.images[imgName].offSrc;
 if(document.images[imgName].filters != null)
  document.images[imgName].filters[0].play();
}
Rollover("home",    "home_on.gif");
Rollover("about",   "about_on.gif");
Rollover("forums",  "forums_on.gif");
</script>

[IN den <BODY> Tag]

[zwischen <BODY> und </BODY>]
<a href = "#"
 onMouseOver="turnOn('home');"
 onMouseOut="turnOff('home');"><img name="home" class="imgTrans"
  src="home_off.gif" border="0"></a><br>
<a href = "#"
 onMouseOver="turnOn('about');"
 onMouseOut="turnOff('about');"><img name="about" class="imgTrans"
  src="about_off.gif" border="0"></a><br>
<a href = "#"
 onMouseOver="turnOn('forums');"
 onMouseOut="turnOff('forums');"><img name="forums" class="imgTrans"
  src="forums_off.gif" border="0"></a><br>

[Autor]

javascript-fx.com

[Download]

Kopieren Sie bitte den Code

Copyright © 1998- Nightfire Webworker Archiv Script No: 439