Discussion :

[Khleo]

Bonjour,

J'ai un script jQuery :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
$(document).ready(function(){
     $('#Boutton').CreateBubblePopup({
     position : 'top',
     align	 : 'center',
     innerHtml: 'Message bulle',
     innerHtmlStyle: {color:'#FFFFFF', 'text-align':'center'}, themeName:'all-black', themePath:'img/jquerybubblepopup-theme'});
     });
});

Je voudrais pouvoir intégrer ce code directement dans ma page en passant des paramètres :

par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

OnMouseOver="AfficherBulle('Message')"

Est-ce possible ?

Merci

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.CreateBubblePopup

se charge du mouseover ...

"Boutton" étant l'id de lelement qui doit declencher l'affichage au survol
et le message etant dans les paramètres

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 innerHtml: 'Message bulle',

[Khleo]

Oui le script fonctionne très bien tel qu'elle, mais il est difficile de le rendre dynamique car le message est stocké dans l’entête de la page.

Ça pose problème si je veux afficher 10 bulles différentes dans le même page.

Merci

[SpaceFrog]

rien ne t'empeche de stocker le message dans le alt de la balise
et d'attribuer les bubbles au moyen d'une classe

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
$(document).ready(function(){
     $('.bubble').CreateBubblePopup({
     position : 'top',
     align	 : 'center',
     innerHtml: $(this).attr('alt'),
     innerHtmlStyle: {color:'#FFFFFF', 'text-align':'center'}, themeName:'all-black', themePath:'img/jquerybubblepopup-theme'});
     });
});

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div class="bubble" alt="message à afficher"> ...

[Khleo]

Ca ne semble pas fonctionner :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
$(document).ready(function(){
     $('.TestClass').CreateBubblePopup({
          position : 'top',
          align	 : 'center',
          innerHtml: 'Message: '+$(this).attr('alt'),
          innerHtmlStyle: {color:'#FFFFFF', 'text-align':'center'}, themeName:'all-black', themePath:'img/jquerybubblepopup-theme'});
});

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div class="TestClass" alt="Txt de la bulle">BlaBla</div>

Il m'affiche : Message: undefined

Merci

[SpaceFrog]

Tu peux nous mettre le lien vers la le plugin que je puisse le telecharger et tester ?