0

奇妙な問題が発生しました。画像をフェードさせたいのです。コードは機能しますが、少なくとも最新の Firefox では、フェード効果がおかしいように見えます。しかし、他のサイト (Web 上) では、同じブラウザーで問題なく動作するようです。OK、これが私のコードです:

HTML:

<div class="fade">
  <img src="http://localhost/ami/wp-content/gallery/ami/400_1.jpg" alt="test" />
  <div class="firstpic">
    <img src="http://localhost/ami/wp-content/gallery/ami/400_2.jpg" alt="test2" />
  </div>
</div>

CSS:

.fade{top: 115px; left: 290px; position: absolute; display: block;}

.firstpic{position: absolute; top: 0px; left: 0px; display: none;}

Javascript:

$("#button").click(function(){
    $(".firstpic").fadeIn(800);
});

したがって、このセットアップは非常に簡単です。2 つの div があり、どちらも絶対位置に配置されています。クラス「firstpic」の div は、クラス「fade」の div の中にあります。どちらも 1 つの img 要素を含んでいます。クラス "firstpic" を持つ div は、デフォルトでは非表示 (CSS を参照) であるため、フェードインできます。フェードインは、ボタンを押すことによってトリガーされます (Javascript を参照)。しかし、きれいにフェードインする代わりに、黒い背景でフェードインします。「img」要素が原因である可能性があると思います。css-background イメージで 2 つの div を使用すると、うまくフェードします。ただし、画像のサイズを変更する必要があるため、img-Elements が必要です。どんな助けでも本当に感謝しています。ありがとう。

4

1 に答える 1

0

これは、Firefox の最近のリリースで発生し始めた問題です。画像にCSSの背景を与える

于 2012-03-26T20:26:14.847 に答える