當鼠標移動到jquery文本上時顯示圖片？

Question

你知道任何教程或腳本顯示一個圖片時mousemove通過HTML文本？

Answer 1

一個基本的例子使用jQuery將是這樣的：

CSS

#myImage { 
    display:none; 
}​ 

HTML

<span class='pictureTrigger'>some text</span> 

<img id='myImage' src='/path/to/image' />​ 

jQuery的

$(function() { // Makes sure DOM loads before code is run 

    $('.pictureTrigger').hover( // Assign event handlers for mouseenter/mouseleave 

     function() { $('#myImage').show(); }, // Find myImage and show it on mouseenter 
     function() { $('#myImage').hide(); } // Find myImage and hide it on mouseleave 
    ); 

}); 

很難提供更好的回答問題中的更多細節。

其基本思想是文本包含在span中，該文本有一個名爲pictureTrigger的類。雖然可以命名任何東西。

懸停事件（實際上是兩個事件的簡寫，mouseenter和mouseleave）被添加到pictureTrigger類的所有元素。

這兩個函數分別代表mouseenter和mouseleave事件。事件處理函數使用ID myImage找到img，並顯示/隱藏它。

---

相關jQuery的文檔：

• .show() - http://api.jquery.com/show/
• .hide() - http://api.jquery.com/hide/
• .hover() - http://api.jquery.com/hover/

Answer 2

Google for tooltip plugin。有很多。