Fondation ballon
Ballons déplacer la souris sur l'élément après le spectacle:
Nous pouvons ajouter tout élément dans le data-tooltip propriété pour créer un message. Utilisez le title attribut pour définir les conseils de message texte.
Remarque: Le curseur nécessite JavaScript. Donc, vous devez initialiser fondationcanadiennede JS:
Exemples
<Span titre data-tooltip = " Hourra!"> Hover sur moi! </ Span>
<! - Initialisation Fondation JS ->
<Script>
$ (Document) .ready (function () {
$ (Document) .foundation ();
})
</ Script>
<! - Initialisation Fondation JS ->
<Script>
$ (Document) .ready (function () {
$ (Document) .foundation ();
})
</ Script>
Essayez »
.has-tip classe peut déplacer le texte en gras de la souris:
position d'affichage de Balloon
Par défaut, la boîte de message apparaîtra au bas de l'élément.
Vous pouvez utiliser .tip-top , .tip-left , .tip-right ou .tip-bottom (par défaut) pour définir la position de la boîte rapide.
Remarque: Sur les écrans de petite taille, ballon à large bande est de 100%.
Exemples
<Span class data-tooltip = " a-tip tip-top" title = "Hourra!"> Top </ span>
<Span class data-tooltip = " a-tip tip-bas" title = "Hourra!"> Bas </ span>
<Span data-infobulle class = " a-tip tip-gauche" title = "Hourra!"> Gauche </ span>
<Span class data-tooltip = " a-tip tip-droite" title = "Hourra!"> Droit </ span>
<Span class data-tooltip = " a-tip tip-bas" title = "Hourra!"> Bas </ span>
<Span data-infobulle class = " a-tip tip-gauche" title = "Hourra!"> Gauche </ span>
<Span class data-tooltip = " a-tip tip-droite" title = "Hourra!"> Droit </ span>
Essayez »
ballon rond
.radius et .round classe est utilisée pour définir la zone des bouts arrondis:
Exemples
<Span class data-tooltip = " a-tip" title = "Hourra!"> Par défaut </ span>
<Span class data-tooltip = " a-tip rayon" title = "Hourra!"> Radius </ span>
<Span data-infobulle class = " a-bout rond" title = "Hourra!"> Round </ span>
<Span class data-tooltip = " a-tip rayon" title = "Hourra!"> Radius </ span>
<Span data-infobulle class = " a-bout rond" title = "Hourra!"> Round </ span>
Essayez »