0

我知道你可以fadeIn并且fadeOut在鼠标悬停时，但我只是想知道当你将背景图像添加到 css 时该怎么做：

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

这是我目前使用的。但是淡入淡出不起作用。

理想情况下，当鼠标不再悬停时，图像背景会发生变化，但会出现淡入淡出和淡出。

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).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 回答
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 回答