BBcode ToolTip

Image Stock de BBcodes pour votre forum .
  • Publicité

BBcode ToolTip

Messagepar ZePhYmA » Sam 24 Mar 2012 20:09

BBcode ToolTip



Description

J'ai adapté un Tooltip trouvé sur le net en BBcode pour mon forum, mais je le distribue si ça peut intéresser certains.
Merci à cabot pour le coup de patte au niveau de l'overflow.

BBcode ToolTip

Utilisation du BBcode
Code: Tout sélectionner
[ToolTip={URL}]{TEXT1}|{TEXT2}[/ToolTip]


Code HTML de remplacement
Code: Tout sélectionner
<a class="tooltip" href="{URL}">{TEXT1}<span class="classic">{TEXT2}</span></a>


Ligne d'aide
Code: Tout sélectionner
[ToolTip=http://www.url.com]Le texte qui s'affiche normalement|Le tooltip ![/ToolTip]


Côté CSS

Ouvrez content.css, et ajoutez ce contenu :
Code: Tout sélectionner
/* BBcode : ToolTip
---------------------------------------- */
.tooltip {
         border-bottom: 1px dotted #000000; color: #000000; outline: none;
         cursor: help; text-decoration: none;
         position: relative;
      }
      .tooltip span {
         margin-left: -999em;
         position: absolute;
      }
      .tooltip:hover span {
         border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
         box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
         font-family: Calibri, Tahoma, Geneva, sans-serif;
         position: absolute; left: 1em; top: 2em; z-index: 99;
         margin-left: 0; width: 250px;
      }
      .classic { padding: 0.8em 1em; }
      .classic {background: #FFFFAA; border: 1px solid #FFAD33; }

Toujours dans content.css, cherchez ceci :
Code: Tout sélectionner
/* Content container styles
----------------------------------------*/
.content {
   min-height: 3em;
        overflow: hidden;
   line-height: 1.4em;
   font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
   font-size: 1em;
   color: #333333;
   padding-bottom: 1px;
}

Et commentez la propriété overflow comme ceci :
Code: Tout sélectionner
/* Content container styles
----------------------------------------*/
.content {
   min-height: 3em;
   /* overflow: hidden; */
   line-height: 1.4em;
   font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
   font-size: 1em;
   color: #333333;
   padding-bottom: 1px;
}


Exemple en image :

Image
Déplacer le curseur de votre souris sur l’image pour l’afficher
Cette image n’est pas hébergée via un domaine approuvé. Pour plus d’informations concernant cette limitation, consultez la FAQ, partie "Hébergement d’images externes"
ZePhYmA
 

Re: BBcode ToolTip

Messagepar Danny07000 » Mar 1 Mai 2012 08:08

Yoh,

Merci à toi, c'est super intéressant ^^

@+++
Avatar de l’utilisateur
Danny07000
 
Messages: 50
Enregistré le: Lun 30 Jan 2012 12:32
Localisation: Alsace (68)
Hébergeur(s): Easy-Hebergement


Retourner vers BBcodes

 


  • Articles en relation
    Réponses
    Vus
    Dernier message

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 0 invités