如何顯示工具提示金球獎當鼠標停止

[編輯] 所以我用的JavaScript工具提示之一以下建議。如果你移動，我會得到提示，告訴你什麼時候停下來，如何隱藏。唯一的問題是它的工作原理當我這樣做：如何顯示工具提示金球獎當鼠標停止

document.onmousemove = (function() { 
    var onmousestop = function() { 
     Tip('Click to search here'); 
     document.getElementById('MyDiv').onmousemove = function() { 
     UnTip(); 
    }; 
    }, thread; 

    return function() { 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 1500); 
    }; 
})();

但我要的功能只適用於特定的DIV，如果我改變的第一行「的document.getElementById（‘MyDiv’）的OnMouseMove = （函數（）{」我得到一個JavaScript錯誤的document.getElementById（ 'MyDiv'）爲空我缺少什麼....？

[/編輯]

我想顯示一個氣球風格當用戶鼠標停止在一個元素上的時間超過1.5秒，然後如果他們移動鼠標我想隱藏氣球我試圖使用一些JavaScript代碼，我發現在第狂野。下面是我用來檢測鼠標何時停止的代碼：

document.onmousemove = (function() { 
    var onmousestop = function() { 
     //code to show the ballon 
     }; 
    }, thread; 

    return function() { 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 1500); 
    }; 
})();

所以我有兩個問題。一，沒有人有推薦的輕量級的JavaScript氣球，將顯示在光標位置。兩個，檢測鼠標停止代碼工作正常，但我很難看到如何檢測到鼠標已經開始再次移動並隱藏氣球。謝謝...

來源

2008-10-06 mrjrdnthms

有點晚回答這個問題，但這對有需要的人有幫助。

我需要這個功能能夠檢測，當鼠標停止移動一定時間徘徊在一個視頻時隱藏的HTML/JS播放器控制器。這是提示修改後的代碼：

document.getElementById('MyDiv').onmousemove = (function() { 
    var onmousestop = function() { 
     Tip('Click to search here'); 
    }, thread; 

    return function() { 
     UnTip(); 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 1500); 
    }; 
})();

在我而言，我有點用的jQuery選擇的元素爲我的球員控制器：

$('div.video')[0].onmousemove = (function() { 
    var onmousestop = function() { 
     $('div.controls').fadeOut('fast'); 
    }, thread; 

    return function() { 
     $('div.controls').fadeIn('fast'); 
     clearTimeout(thread); 
     thread = setTimeout(onmousestop, 1500); 
    }; 
})();

來源

2010-03-04 18:04:54 Chauncey

這是一個漂亮的jQuery插件，用於漂亮的浮動工具提示。

http://jqueryfordesigners.com/demo/coda-bubble.html

[編輯] 我想沒有看到同伴HTML很難說什麼是錯的。我會仔細檢查元素是否有標籤中指定的相應ID。除此之外，除非這是一個學術練習，否則我會建議使用上面引用的jQuery插件之類的東西。當然還有許多其他的預建工具，它們已經處理了您當前正在處理的所有細節。

來源

2008-10-06 16:49:41 theraccoonbear

document.onmousemove = (function() { 
    if($('balloon').visible) { 
    //mouse is moving again 
}....//your code follows

使用Prototype.js語法，您可以確定在氣球可見時鼠標移動了。

來源

2008-10-06 16:58:43

的jQuery插件hoverIntent提供了類似的行爲。它通過檢查是否將鼠標放慢移動到元素中並將一定量的時間停留在元素上來確定用戶是否意指將鼠標懸停在特定元素上。

它只有當用戶離開元素，這聽起來並不像你尋找什麼，但代碼是很簡單的火災「走出去」的事件。

同時還要注意結合東西鼠標移動時，你不需要將收集的事件，鼠標移動迅速激發了很多活動，並可以對你的網站的性能產生嚴重影響。當光標進入活動元素時，hoverIntent只綁定mousemove，之後解除綁定。

如果你嘗試hoverIntent我有一些麻煩縮小的版本不觸發「走出去」的事件，所以我會建議使用完整，unminified源。

來源

2008-10-07 07:58:27 NickV

如何顯示工具提示金球獎當鼠標停止

回答

相關問題