pngとjqueryを使用してロールオーバーを行うにはどうすればよいですか？

Question

私はオンラインで見つかったスクリプトを逆にしてコーディングしましたが、うまくいきました。唯一の問題はホバーの動作が完全な可視性でロードされることです。これはスクリプトです：あなたがここでのサンプルを表示することができます

<div class="fadehover"> 
<a href=""><img src="portfolio_a.png" alt="" class="a" /> 
<img src="portfolio_b.png" alt="" class="b" /></a> 

</div> 

：http://www.kaimeramedia.com/derek/Website/test.html

を

<style> 
div.fadehover { 
    position: relative; 
    } 

img.b { 
    position: absolute; 
    left: 0; 
    top: 0; 

     z-index: 10; 
    } 

img.a { 
    position: absolute; 
    left: 0; 
    top: 0; 
    } 
</style> 

そして、これは、身体のコードです：

$(document).ready(function() 
{ 
$("img.b").hover(
function() { 
$(this).stop().animate({"opacity": "1"}, "slow"); 
}, 
function() { 
$(this).stop().animate({"opacity": "0"}, "slow"); 
}); 

}); 
</script> 

これは、CSSファイルです

Answer 1

CSSを変更してオンロードを非表示にする：

img.b { 
    position: absolute; 
    left: 0; 
    top: 0; 
    z-index: 10; 
    opacity: 0; 
    filter: alpha(opacity=0); 
} 

filter:alpha(opacity=0);は、I.E.