0

私はあなたができることを知っていますfadeIn、そしてfadeOutマウスオーバーで、私はあなたが背景画像をcssに追加するときにそれをどのように行うのか疑問に思っていました：

$(document).ready(function() {      
     $('.bubble').mouseover(function() {             
         $('.bubbleSpeach').fadeIn("slow");          
         var path= this.id + ".png";                 
         $('.bubbleSpeach').css({'background-image': "url(" + path + ")"});              
    });

これは私が現在使用しているものです。ただし、fadeInは機能しません。

理想的には、画像の背景は変化しますが、マウスがホバーしなくなったときにフェードイントランジションとフェードアウトが発生します。

4

5 に答える 5

2

これで試してください：

$('.bubble').on({
       mouseover:function() {                       
           var path= this.id + ".png";                 
           $('.bubbleSpeach').css({'background-image': "url(" + path + ")"}).fadeIn("slow");
       },
       mouseout: function(){
           $('.bubbleSpeach').fadeOut("slow");
       }
});

adding css最初に試してくださいthen fade it in。

于 2013-03-05T11:22:31.943 に答える
1

より簡単な方法は、hover（）を使用することです。

$("#id").hover(function(){
    $("#exampleText").fadeIn("slow");
},
function(){
    $("#exampleText").fadeOut();
});
于 2013-03-05T11:22:14.140 に答える
0 
$(document).on("mouseover",".bubble",function() {    
//your code..for fadeIn
 });

このようにしてみてください。

于 2013-03-05T11:21:07.760 に答える
0

バブルはどのようなオブジェクトを表していますか？divまたはこれはページ全体ですか？

hover（）関数を試しましたか？

于 2013-03-05T11:21:41.270 に答える
0

これは、不透明度のあるアニメーション効果を使用したい場合があります

$(document).ready(function() {
 $('bubbleSpeach').css({'background':'url/img.png'})      
 $('.bubble').mouseover(function() {             
    $('.bubbleSpeach').animate({opacity:0)},1000 function() {
        $('bubbleSpeach').css({'background':'url/img2.png'})
        $('.bubbleSpeach').animate({opacity:1}),1000}
   }); 
});
于 2013-03-05T11:43:54.737 に答える