在mouseenter上連續運行函數 - jquery

只要我在mouseenter上，我該如何獲得循環/繼續的函數？如果我在第一個腳本的持續時間之後添加colorPixels（），它不會停在mouseleave上。在mouseenter上連續運行函數 - jquery

    <script type="text/javascript"> 
       function pixelColors(){ 
       var color = 'rgb('+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+')'; 
       $('#logo_back').animate({ 
          backgroundColor:color 
         }, 2000); 

       } 
       </script> 


       <script> 

       $(document).ready(function() { 

       $("#logo").bind('mouseenter', function() { 
       pixelColors() }); 


       $("#logo").bind('mouseleave', function() { 
       jQuery(this).stop(true, true); 


       }); 

       }); 



       </script>

來源

2011-09-11 AAAndreAAA

如何：

var mouseOver = false; 
function pixelColors() { 
    if (mouseOver) { 
    var color = 'rgb(' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ')'; 
    $('#logo_back').animate({ 
     backgroundColor: color 
    }, 2000, pixelColors); 
    } 
} 

$(document).ready(function() { 

    $("#logo").bind('mouseenter', function() { 
     mouseOver = true; 
     pixelColors(); 
    }); 


    $("#logo").bind('mouseleave', function() { 
     mouseOver = false; 
    }); 

});

例子：http://jsfiddle.net/jfebC/

或者，使用.stop()喜歡自己正在做目前：

function pixelColors() { 
    var color = 'rgb(' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ')'; 
    $('#logo_back').animate({ 
     backgroundColor: color 
    }, 2000, pixelColors); 
} 

$(document).ready(function() { 

    $("#logo").bind('mouseenter', pixelColors); 

    $("#logo").bind('mouseleave', function() { 
     $("#logo_back").stop(); 
    }); 
});

實例：http://jsfiddle.net/TyybP/

來源

2011-09-11 00:16:08

這不符合OP的要求。 OP想停止當你mouseover – genesis

從原來的帖子*「我如何獲得函數循環/繼續，只要我在mouseenter？」* –

嘿安德魯！ 2號門是完美的 - 謝謝你！我喜歡像'（'這樣簡單的東西可以拋出你的整個遊戲......我太親近了！:) – AAAndreAAA

你可以有你pixelColors()動畫從完成功能重新啓動本身，因此直到你mouseleave調用.stop()它將無限期地運行。而且，只要確保在鼠標不再徘徊時停止調用自己。有幾種方法可以做到這一點。我選擇在這裏使用jQuery.data（）實際動畫對象上保存的一段狀態。它也可以用全局變量或更高/共享範圍內的變量來完成。

function pixelColors() { 
    var color = 'rgb('+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+')'; 
    $('#logo_back').animate({ 
     backgroundColor:color 
    }, 2000, function() { 
     if ($('#logo_back').data("mouseenter")) { 
      pixelColors() // call it again, if mouse still over 
     } 
    }); 
} 

$("#logo").bind('mouseenter', function() { 
    $('#logo_back').data("mouseenter", true); // set state of mouse hover 
    pixelColors() }); 


    $("#logo").bind('mouseleave', function() { 
    $('#logo_back').data("mouseenter", false); // clear state of mouse hover 
     jQuery(this).stop(true, true); 
    }

來源

2011-09-11 00:13:58 jfriend00

在mouseenter上連續運行函數 - jquery

回答

相關問題