0

アプリの読み込み時に背景画像を持たない要素があります。次に、ボタンがクリックされると、CSS クラスが要素に追加され、その要素の背景画像が数秒間設定されます。問題は、背景画像をフェードインおよびフェードアウトできないことです。

私が試したこと：

.MyBox.formElementInput {
background-repeat: no-repeat;
background-position: 65px center;
background-size: "contain";
-webkit-transition:background-image 2s ease-in-out;
-moz-transition: background-image 2s ease-in-out;
-o-transition: background-image 2s ease-in-out;
transition: background-image 2s ease-in-out;
}

.MyBox.formElementInput.showSpinner {
    background-image : url("/PmDojo/dojox/widget/Standby/images/loading.gif");
}

編集: JQuery はオプションではありません。

4

2 に答える 2

0

CSS は、javascript プラグインなしでは背景画像をフェードまたはアニメーション化しません。CSS オプションのみが必要な場合は、それを div でラップし、div 全体をフェードイン/フェードアウトする必要があります。

于 2012-11-19T19:19:11.753 に答える
0

divフェードイン/アウトの内容も気にしない場合:

#div-with-bg{                
    -webkit-transition: opacity 1.5s linear;
    -moz-transition: opacity 1.5s linear;
    transition: opacity 1.5s linear;
    background: url(background.png);
    opacity: 0;
}
#div-with-bg:hover{
    opacity: 1;
}
于 2014-01-23T00:20:21.503 に答える