11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai découvert ce script http://lemonfamily.net/projects/jgrowl.html.

Même s'il n'est pas forcément fait pour ça, j'ai entrepris de l'utiliser comme tooltip pour faire des notes (de bas de page !) dans mes articles.

...on a du texte avant la note
(<a id="note_1" href="javascript:void(0);">1</a>)

et du texte après la note...

on lui applique ça...


$(document).ready(function(){
	$("#note_1").click(function() {
		$.jGrowl("je suis une note et je donne des infos", {
	});
});


et ça marche super bien... sauf que...

...mes notes sont longues et qu'en plus elles contiennent des liens vers des sites d'archives, je voudrais pouvoir "l'externaliser" dans une DIV pour pourvoir l'appeler

J'ai tester quelque chose comme cela :

...on a du texte avant la note
(<a id="note_1" href="javascript:void(0);">1</a>)

et du texte après la note...


<!-- NOTES DE BAS DE PAGES -->
	<div id="contenu_note_1" class="groal" style="display:none;">
	<p>Une émission a également été consacrée au personnage de bande dessinée Corto Maltese.</p>
	</div>
<!-- #NOTES DE BAS DE PAGES -->




$(document).ready(function(){
	$("#note_1").click(function() {
		$.jGrowl("C'est ici que s'inscrit habituellement le message mais moi je voudrais le mettre ailleurs, genre dans un span ou une div", {
			beforeOpen: function() {
				alert("Ça marche... ou bien !");
				$(document).ready(function() {
					$('#contenu_note_1').show("p");
					});
			}
		});
	});
});


Mais la note apparaît en dehors du tooltip !

Quelqu'un aurait-il une idée ? Merci pour votre aide

P.S. Bien entendu, il y aura plusieurs notes de bas de page
Modifié par warda (18 Apr 2010 - 20:51)
As tu trouvé une solution? Cela me serait d'une très grande aide je fonctionne aussi sous jgrowl Smiley langue

Merci beaucoup !