JQuery工具提示閃爍狩獵

我有一個噩夢提示工具提示，經過幾個小時花在審查我的代碼和檢查一些插件，我決定在我瘋了之前尋求一些幫助。JQuery工具提示閃爍狩獵

基本上我的工具提示可以在所有瀏覽器中完美運行，但有一個例外;蘋果瀏覽器。我的問題是，當我傳遞任何圖像，瀏覽器開始閃爍白色，我還沒有找到任何解決方案，但看起來像我的問題是工具提示腳本。

我有一個例子：

this.imagePreview = function() 
{ 
    var xOffset = 10; 
    var yOffset = 30; 

    $('#Images a').hover(function(e) 
    { 
     var tooltipName = $(this).attr('rel'); 

     this.t = this.title; 
     this.title = "";  
     var c = (this.t != "") ? "<br/>" + this.t : ""; 

     $("body").append("<p id='tooltip' class='imageToolTip'><img src='" + BASE + "/img/template/Images/tooltip" + tooltipName + ".png' />"+ c +"</p>"); 

     $("#tooltip") 
     .css("top",(e.pageY - xOffset) + "px") 
     .css("left",(e.pageX + yOffset) + "px") 
     .fadeIn("fast");       
    }, 
    function(){ 
     this.title = this.t;  
     $("#tooltip").remove(); 
    }); 

    $('#Images a').mousemove(function(e) 
    { 
     $("#tooltip") 
      .css("top",(e.pageY - xOffset) + "px") 
      .css("left",(e.pageX + yOffset) + "px"); 
    }); 

};

CSS

.imageToolTip {position: absolute; z-index: 9999; margin-left: -120px; margin-top: 27px;}

你的幫助非常感謝。

來源

2011-10-31 ron

只是一個快速的想法，因爲它經常解決這樣的問題：你有沒有嘗試在'fadeIn'之前調用'stop（）'？ –

沒關係，只是意識到你在創建工具提示dom元素之前幾行就是淡入。 –

我有，但沒有工作。也當我離開2刪除只是眨眼一次，這很奇怪。歡呼 – ron

這可能是因爲你使用懸停。懸停是一個不斷的回調，觸發你移動的每個像素，就像調整窗口的大小一樣。

你最好把你的功能分成「mouseenter」和「mouseleave」。此外，這種使用回調的方式已經過時了。新方法（非常方便）是使用$('#id').on("mouseenter", function(){});

您的mousemove觸發器也應該小心使用。將一個布爾值與mouseenter和離開函數結合起來可能很明智。

爲理念，在步驟：
首先創建var entered = false;
1：鼠標進入區域
2：做你想做的事，然後說"entered = true;"
3：現在你已經做到了這一點，圍繞你的onhover功能（或mouseenter，或鼠標移動，或任何可能發生某些功能的功能）與if(!entered){//do your thing}
4：現在，您必須計算該人是否仍在您的偏移範圍內。如果不是：entered = false;

因爲他們離開了這個區域，我們在if(!entered)語句中放置的效果可能會再次觸發，但這次只能觸發一次。

來源

2014-06-18 02:35:08 NoobishPro

JQuery工具提示閃爍狩獵

回答

相關問題