2012-03-26 13 views
0

私は奇妙な問題を抱えています。コードは機能しますが、少なくとも最新のFirefoxではフェーディング効果がf ###上になります。しかし、他のサイト(ウェブ上)では、明らかに同じブラウザでうまく動作します。 OK、ここに私のコードです:FirefoxのJQuery:画像が黒から消えてしまいます。他の画像ではありません。

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を:私は2つのdivのを得た:

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

ので、このセットアップは非常に簡単です両方とも絶対的に位置付けられた。 "firstpic"クラスのdivは、 "fade"クラスのdivにあります。どちらもimg要素を1つ含んでいます。 "firstpic"クラスのdivは、デフォルトでは表示されません(CSS参照)ので、フェードインすることができます。フェードインするには、ボタンを押す(JavaScriptを参照)。しかし、うまくフェードインするのではなく、黒い背景でフェードインします。私はそれが "img"要素のためかもしれないと思う。私はCSSの背景画像と2つのdivを使用すると、うまく消えます。しかし、画像のサイズを変更する必要があるので、img-Elementsが必要です。 本当にありがとうございます。ありがとう。

+1

私はこれに問題はありませんでした。私の例を見てください - http://jsfiddle.net/7xWWt/ – tjscience

+0

あなたは黒い背景から退色していますが、別の画像で退色していません。もちろん、それはうまく見えます。 – lupor

答えて

0

これは、最近のFirefoxのリリースではじまり始める問題です。イメージにCSSの背景を付けてください

+0

ありがとう、しかし、私は限り、私は知っている - CSSを介してうまくいきませんイメージのサイズを変更する必要があります。あなたはこの問題についてもっと知っていますか?それがすぐに解決されるのでしょうか? – lupor

+0

は私がjQueryフォーラムで見ることを始めた何か新しいものです。いくつかの人が画像に背景を与えることで解決しました....サイズやサイズ変更に関係なく、ちょうど背景のCSS – charlietfl

+0

ありがとう、それは働いた! – lupor

関連する問題