Dropboxは透明なPNG +不透明度をIEでどのように機能させるのですか？

Question

www.dropbox.comのwatch_a_video2.png画像は透明度が0.5の透明なPNG画像です。その上にマウスを置くと、不透明度が変わります。

IE7/8でwatch_a_video2.png画像の周囲に暗い輪郭線が表示されないようにするにはどうすればよいですか？

私は任意のフィルタまたは特定のIEの修正ライブラリが表示されない...

私はjQueryを使って自分のスタイルを再現しようと、それは、Firefox/Safariのと正常に動作しますが、私はIEと暗いアウトラインを取得します。

ありがとうございました。

Answer 1

彼らはプロトタイプ（ちょっとjQueryのようなJavaScriptフレームワーク）を使用しています。このコードは、効果を達成するために表示されます（つまり、彼らはCSSを使用して、単純ではありません）：

document.observe("dom:loaded", function() { 

    var play_link = $("playvideo"); 

    play_link.observe("mouseover", function() { 
     new Effect.Opacity(play_link.down("img"), { duration: 0.2, to: 1.0 }); 
    }); 

    play_link.observe("mouseout", function() { 
     new Effect.Opacity(play_link.down("img"), { duration: 0.2, to: 0.5 }); 
    }) 


    if (!FlashDetect.versionAtLeast(9)) { 
     $("has_flash").hide(); 
     $("no_flash").show(); 
    } 
}); 

このコードが適用されるHTML：

<a href="#" id="playvideo" onclick="play_screencast(); return false;"> 
    <img src="images/watch_a_video2.png" alt="Watch a video about Dropbox."/><br /> 
    Watch a Video 
</a> 

あなたは、おそらくこのような何かを設定する必要がありますCSSの場合も同様です：

a {text-decoration:none;} 
img { border:none;} 
/* of course you'd probably want to use a class or id on these elements */ 

上記のCSSは、画像の下線とリンクからアンダーラインを削除します。

最後に、実際のコードを投稿すると役立つかもしれません（私はIE8で青い輪郭が見えませんでした）。