Fade med JavaScript ?

Tags:    html css

Jeg vil have et billede til at fade ud onmouseover og fade ind onmouseout, og har derfor skrevet dette lille script:

Fold kodeboks ind/udKode 

Problemet er, at billedet gerne vil fade ud onmouseover.. Men det vil ikke fade ind igen ??
Håber at nogen kan give mig et svar på, hvad jeg gør forkert :) ..

På forhånd tak!

PS. Dette script virker ikke i IE



Indlæg senest redigeret d. 09.09.2006 16:26 af Bruger #9976
3 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 2 karma
Sorter efter stemmer Sorter efter dato
Hej

Her er løsningen på dit problem.. Tjek lige koden:

Fold kodeboks ind/udKode 





Wessam, dit script dur kun i IE.

Thomas, prøv at tjekke http://script.aculo.us



Hej

Her er løsningen på dit problem.. Tjek lige koden:

<html>
<head>
<style>
img
{
filter:alpha(opacity=100)
}
</style>
<script type="text/javascript">
function hide() {
timerOut = setInterval("fadeOut(pic)", 10);
}

function fadeOut() {
if(document.getElementById('pic').filters.alpha.opacity > 10) {
document.getElementById('pic').filters.alpha.opacity -= 5;
}
else if (window.timerIn) {
clearInterval(timerOut);
}
}

function show() {
clearInterval(timerOut);
timerIn = setInterval("fadeIn(pic)", 10);
document.getElementById('pic').filters.alpha.opacity=10;
}

function fadeIn() {
if(document.getElementById('pic').filters.alpha.opacity < 100) {
document.getElementById('pic').filters.alpha.opacity += 5;
// document.getElementById('myLink').style.filter=false
}
else if (window.timerOut) {
clearInterval(timerIn);
// clearInterval(timerOut);
}
}
</script>
</head>
<body>
<a href="default.asp">
<img id="pic" border="0" src="http://i2-images.tv2.dk/s/44/1075044-cdf92da15c26d124542d6cef7c286b50.jpeg" onmouseover="hide()" onmouseout="show()" />
</a>
</body>
</html>




t