0

マウスオーバー時に別の画像を表示して画像を表示する必要があります。これは一種のメニューです。これはクロムとファイアフォックスで動作します。何か案が?ここに来る

<div id="button1OverStyle" class="buttonOverStyle" onclick="changeFrame('main/main.html')" >
<img id="button1OverStyleImage" src="images/button_home.png" height="24" width="46" />

<script>      
  $('#button1OverStyle').hover(function(e) {
    showTittle('button1OverStyleImage');  });
  $('#button1OverStyle').mouseleave(function(e) {
    hideTittle('button1OverStyleImage');});
  $('#button2OverStyle').mouseover(function(e) {
    showTittle('button2OverStyleImage'); });
  $('#button2OverStyle').mouseleave(function(e) {
    hideTittle('button2OverStyleImage'); });      
</script>

どこにあるか見つけました。そして、これが問題です

この行で

<div id="button1OverStyle" class="buttonOverStyle" onclick="changeFrame('main/main.html')" >
            <img id="button1OverStyleImage" src="images/button_home.png" height="24" width="46" />
        </div>

ここにCSSがあります

.buttonOverStyle{   position:absolute;  cursor:pointer;     z-index:1000;   height:24px;}  .buttonOverStyle img {   display:none;}

問題は、画像が表示されていない場合、Internet Explorer が div を認識しないため、「mouseenter」または「mouseover」を作成できないことです。

何か案が??????

4

2 に答える 2

1

試してくださいmouseenter

mouseenter JavaScript イベントは、Internet Explorer 独自のものです。イベントの一般的なユーティリティのため、jQuery はこのイベントをシミュレートして、ブラウザーに関係なく使用できるようにします。このイベントは、マウス ポインターが要素に入ったときに要素に送信されます。任意の HTML 要素がこのイベントを受け取ることができます。

HTML

<div>test</div>​

jQuery

$("div").mouseenter(function(){
    $(this).css("color", "red");
});
$("div").mouseleave(function(){
    $(this).css("color", "blue");
});

あなたも試すことができます.hover()

于 2012-10-08T18:30:15.997 に答える
1

解決!

すべてCssで作成しますが、不透明度があります

.buttonOverStyle img {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
filter: alpha(opacity=10);
opacity: .1;}


.buttonOverStyle img:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
opacity: .9;}

これは私のために働く

于 2012-10-16T21:10:50.323 に答える