|
Flash-achtig effect, ringen om een link
Dit script maakt als je met je muis over een link gaat een flash achtig effect en maakt ringen om de link heen
<!-- PLAATS DIT DEEL VAN HET SCRIPT TUSSEN <HEAD> EN </HEAD> -->
<script language="javascript">
// the number of rings
var ringnumber=4
// do not edit the code below
var x,y
var timer
var i_fontsize=new Array
var step=new Array
ringnumber=ringnumber-1
var maxfontsize=600
var startfontsize=1
for (i=0;i<=ringnumber;i++) {
i_fontsize[i]=startfontsize
step[i]=ringnumber*i*10
startfontsize=(maxfontsize/ringnumber)*(i+1)
}
function cursorposition(e){
x=event.clientX+document.body.scrollLeft
y=event.clientY+document.body.scrollTop
}
function showrings() {
if (document.all) {
for (i=0;i<=ringnumber;i++) {
if (i_fontsize[i]>=maxfontsize) {i_fontsize[i]=1;step[i]=1}
var thisring=eval("document.all.ring"+i+".style")
thisring.visibility="visible"
thisring.fontSize=i_fontsize[i]
thisring.color="rgb("+Math.floor(i_fontsize[i]/2.0)+","+Math.floor(i_fontsize[i]/2.0)+",255)"
thisring.posLeft=x-(Math.floor(i_fontsize[i]/3))
thisring.posTop=y-(Math.floor(i_fontsize[i]/1.4))
step[i]+=2
i_fontsize[i]+=step[i]
}
timer=setTimeout("showrings()",50)
}
}
function hiderings(e){
if (document.all) {
clearTimeout(timer)
startfontsize=0
for (i=0;i<=ringnumber;i++) {
thisring=eval("document.all.ring"+i+".style")
thisring.visibility="hidden"
i_fontsize[i]=startfontsize
step[i]=ringnumber*i*10
startfontsize=Math.floor((maxfontsize/ringnumber))*(i+1)
}
}
}
if (document.all) {
document.onmousemove=cursorposition;
}
if (document.all) {
for (i=0;i<=ringnumber;i++) {
document.write("<DIV id='ring"+i+"' style='position:absolute;font-family:Verdana;'>o</DIV>")
}
document.write("<DIV style='position:relative;'>")
}
</script>
<!-- PLAATS DIT DEEL VAN HET SCRIPT TUSSEN <BODY> EN </BODY> -->
<center><br><br><br>
<a href="" onMouseOver="showrings()" onMouseOut="hiderings()">Ga hier overheen met de muis</a>
download het script
Zie hier een demo van het script
Reacties van leden
|
