Показать текст в изображении Hover

Question

Я пытаюсь, чтобы изображение было показано при наведении на изображение, которое помещается в div (#web01).

Я играл с mouseenter/mouseleave и смог получить текст, но когда я связываю его с div, он, похоже, не работает.

Это, наверное, легко, но я не вижу, что я делаю неправильно.

$(document).ready(function() { 
    $("#web01").mouseenter(function() { 
     $("#titel").html('<p class="titel">description</p>'); 
    }); 
    $("#web01").mouseleave(function() { 
     $("#titel").html('<p class="titel"></p>'); 
    }); 
}) 

Answer 1

<div id="web01" title="myTitle">...</div> или <img src="..." title="myTitle"/> покажет родное название браузера (подсказка).

Answer 2

Я думаю, что нужно что-то вроде этого:

http://jqueryui.com/tooltip/

Answer 3

Предполагая, что вы имели в виду, чтобы назвать свой элемент title1 и не titel1 (написано неправильно), просто изменив идентификатор для title1 исправляет проблему. Я привел рабочий пример ниже.

Working Example

Answer 4

В примере http://api.jquery.com/mouseenter/ я видел, как они используют это в функции.

$(document).ready(function(){ 
$("#web01").mouseenter(function(){ 
    $("#titel",this).html('description'); 
}); 

$("#web01").mouseleave(function() { 
    $("#titel",this).html(''); 
}); 
});