jQuery - fadeIn , fadeOut , fadeTo - zasada dzialania

0

witam

mam oto taki kod
powinien pokazywac i ukrywac plynnie warstwe

problem w tym ze nie pokazuje jej wcale
ale gdy juz zamienie fadeIn na fadeTo('normal', 1.0) a fadeOut na fadeTo('normal', 0.0) to dziala bez problemu
z wyjatkiem IE gdzie za pierwszym razem warstwa nie jest pokazywana w sposob plynny

czy fadeIn nie powinno dzialac identycznie jak fadeTo("normal", 1.0) a fadeOut jak fadeTo("normal", 0.0)
jesli nie to jaka jest miedzy nimi roznica bo domyslam sie ze obydwa realizuja animacje za pomoca opacity
no i w koncu dlaczego IE za pierwszym razem nie wyswietla plynnie warstwa

z gory dziekuje za odpowiedzi

<html>

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<style>

div
		{
		background: silver;
		position: absolute;
		top: 200px;
		left: 200px;
		width: 400px;
		height: 200px;
		text-align: center;

		opacity: 0.0;
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
		filter: alpha(opacity=0);

		}

</style>

<script>

$(document).ready(function(){

	$("#a1").click(
		function() 
		{
			$("div").fadeIn();

		}
	);

	$("#a2").click(
		function() 
		{
			$("div").fadeOut();
		}
	);

});

</script>

</head>

<body>

 <a href="#" id="a1">pokaz</a><br>
 <div><a href="#" id="a2">Tekst _ Tekst _ Tekst</a></div>

</body>

</html>
0

z tego co pamiętam to nie trzeba było nic kombinować z opacity, wystarczy ustawić display:none; i fade chodzi

EDIT: sprawdziłem i potwierdzam hipoteze:

<html>
 
<head>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
 
<style>
 
div
                {
                background: silver;
                position: absolute;
                top: 200px;
                left: 200px;
                width: 400px;
                height: 200px;
                text-align: center;
 
                display: none;
 
                }
 
</style>
 
<script>
 
$(document).ready(function(){
 
        $("#a1").click(
                function() 
                {
                        $("div").fadeIn();
 
                }
        );
 
        $("#a2").click(
                function() 
                {
                        $("div").fadeOut();
                }
        );
 
});
 
</script>
 
</head>
 
<body>
 
 <a href="#" id="a1">pokaz</a><br>
 <div><a href="#" id="a2">Tekst _ Tekst _ Tekst</a></div>
 
</body>
 
</html>
0

dzieki - dziala :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1