Astuces pour l'outil JQuery

Question

Je souhaite créer une info-bulle pour une image avec un lien maintenant que je l'ai fait fonctionner mais cela ne fonctionne pas avec la 2ème image.

Voici mon exemple de code:

<!-- trigger element. a regular workable link --> 
<a id="test" title="Name - Title">Name</a> 

<!-- tooltip element --> 
<div class="tooltip"> 
<div><span class="name">Name</span><br /> 
Title 
<span><a href="#">more info»</a></span></div> 
</div> 

<!-- trigger element. a regular workable link --> 
<a id="test2" title="Name - Title">Name</a> 

<!-- tooltip element --> 
<div class="tooltip2"> 
<div><span class="name">Name</span><br /> 
Title 
<span><a href="#">more info»</a></span></div> 
</div> 

et voici mon script qui fait tout se passe:

<script> 
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready 

$(document).ready(function() { 

// enable tooltip for "test" element. use the "slide" effect 
$("#test").tooltip({ 
effect: 'slide', 
    offset: [50, 40] }); 

$("#test2").tooltip2({ 
effect: 'slide', 
    offset: [50, 40] }); 
}); 
</script> 

mais ne fonctionne pas s'il vous plaît aider. voici le sample Jquery Je suis en train todo

Answer 1

$("#test2").tooltip({ // You had .tooltip2 
effect: 'slide', 
    offset: [50, 40] }); 
}); 

Explication:

Le plugin infobulle fournit une fonction appelée tooltip qui fait partie de l'objet jQuery. Une fois que vous avez chargé jquery et le plugin tooltip, chaque objet jquery que vous créez [FYI: $(selector) crée un objet jquery] peut appeler cette fonction sur lui-même. Lorsque vous appelez tooltip2(), vous appelez une fonction qui n'existe pas, et rien ne se passe.

Est-ce que cela a du sens?

Answer 2

Je voudrais essayer ce pour le html ...

<!-- trigger element. a regular workable link --> 
<a id="test" title="Name - Title">Name</a> 

<!-- tooltip element --> 
<div class="tooltip"> 
<div><span class="name">Name</span><br /> 
Title 
<span><a href="#">more info»</a></span></div> 
</div> 

<!-- trigger element. a regular workable link --> 
<a id="test2" title="Name - Title">Name</a> 

<!-- tooltip element --> 
<div class="tooltip"> 
<div><span class="name">Name</span><br /> 
Title 
<span><a href="#">more info»</a></span></div> 
</div> 

et ceci pour le javascript ...

<script> 
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready 

$(document).ready(function() { 

// enable tooltip for "test" element. use the "slide" effect 
$("#test, #test2").tooltip({ 
effect: 'slide', 
    offset: [50, 40] }); 
}); 
</script>