Bonjour Sylver,
* Tous mes meilleurs vœux pour cette année 2019
J'ai repairer sur ton forum la fonction Tooltip qui est très bien réalisée. Je me demander ci tu pouvez partager les codes source de celle-ci ?
Merci d'avance.
[Réglé] Support des styles ⇒ Tooltip Breizh Code
-
- Messages : 15
- Enregistré le : 18 novembre 2018
-
Liquide : 432.55
- Localisation : Grand-Est
- Pays :
France (fr)
Tooltip Breizh Code
janv. 19
0614:33
"Cookie : Anciennement petit gâteau sucré, qu'on acceptait avec plaisir. Aujourd'hui : petit fichier informatique drôlement salé, qu'il faut refuser avec véhémence."
-
- Administrateur du site
- Messages : 769
- Enregistré le : 13 janvier 2018
-
Liquide : 3 908.30
- Relax-Arcade : 1
- Localisation : Bretagne
- Pays :
France (fr)
Tooltip Breizh Code
janv. 19
0615:01
Bonjour,
Pour l'effet tooltip (qui remplace l'attribut title dans un lien) il faut donc faire des modifications dans ton style.
Premièrement, ne pas toucher au style prosilver qui doit rester intact.
Tu doit avoir un style enfant de prosilver, c'est lui qui doit être modifié.
En premier, la modification du lien (<a...)
Dans la balise lien tu ajoute:
Seulement si le lien ne comporte pas déjà un attribut class, sinon tu ajoute seulement
Ensuite, le lien doit contenir l'attribut title, sinon, tu l'ajoute avec dedans la clef de langue voulue.
Création du span:
le lien doit contenir un span avec un attribut title vide
Si un span existe déjà il suffit d'ajouter l'attribut title dedans.
Un exemple, le lien "Index du forum":
La partie css:
A mettre dans par exemple le fichier common.css de ton style:
Tu peut jouer avec le css pour obtenir les effets voulus
Pour l'effet tooltip (qui remplace l'attribut title dans un lien) il faut donc faire des modifications dans ton style.
Premièrement, ne pas toucher au style prosilver qui doit rester intact.
Tu doit avoir un style enfant de prosilver, c'est lui qui doit être modifié.
En premier, la modification du lien (<a...)
Dans la balise lien tu ajoute:
code : Tout sélectionner
class="tooltip"
tooltip
dedans.Ensuite, le lien doit contenir l'attribut title, sinon, tu l'ajoute avec dedans la clef de langue voulue.
Création du span:
le lien doit contenir un span avec un attribut title vide
title=""
.Si un span existe déjà il suffit d'ajouter l'attribut title dedans.
code : Tout sélectionner
<span title="">Ton lien</span>
code : Tout sélectionner
<a href="{U_SITE_HOME}" itemprop="url" data-navbar-reference="home" class="tooltip"><i class="icon fa-home fa-fw" aria-hidden="true"></i><span itemprop="title" title="">{L_SITE_HOME}</span></a>
A mettre dans par exemple le fichier common.css de ton style:
code : Tout sélectionner
a:hover span, a:focus span{
opacity:1.5;
}
.tooltip{
display: inline;
position: relative;
}
.tooltip:hover:after{
background: #333;
background: rgba(0,0,0,.8);
border-radius: 5px;
bottom: 26px;
color: #fff;
content: attr(title);
left: 20%;
padding: 5px 15px;
position: absolute;
z-index: 1000;
width: 220px;
}
.tooltip:hover:before{
border: solid;
border-color: #333 transparent;
border-width: 6px 6px 0 6px;
bottom: 20px;
content: "";
left: 50%;
position: absolute;
z-index: 1000;
}
Des chercheurs qui cherchent, on en trouve, mais des chercheurs qui trouvent, on en cherche !
-
- Messages : 15
- Enregistré le : 18 novembre 2018
-
Liquide : 432.55
- Localisation : Grand-Est
- Pays :
France (fr)
Tooltip Breizh Code
janv. 19
0615:05
Merci pour le partage, je test et je reviendrais ci je n'arrive pas à régler un détail.
"Cookie : Anciennement petit gâteau sucré, qu'on acceptait avec plaisir. Aujourd'hui : petit fichier informatique drôlement salé, qu'il faut refuser avec véhémence."
-
Membres connectés en temps réel
-
- Sujets similaires
- Réponses
- Vues
- Dernier message
-
- 4 Réponses
- 2952 Vues
-
Dernier message par stone23
-
- 1 Réponses
- 1916 Vues
-
Dernier message par Sylver35
-
- 3 Réponses
- 3231 Vues
-
Dernier message par Sylver35
-
- 7 Réponses
- 4550 Vues
-
Dernier message par YAZ