Annonce qui s'affiche dès que passe la souris

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Mer 20 Mar 2013 - 14:15

Bonjour ,
je n'ai pas trouvée de messages de ce genre donc je poste Very Happy
Voici ce que je voudrai :
ceci...:
Donc, dès que la souris passe il s'affiche une image ou du texte qui nous mène a un lien~
Voilà le forum ou la capture a été prise : http://www.cocktail-graph.com
Voilà merci d'avance


Dernière édition par NovemberGrW le Ven 22 Mar 2013 - 16:23, édité 1 fois

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Mer 20 Mar 2013 - 19:05

Up


Dernière édition par NovemberGrW le Mer 20 Mar 2013 - 19:22, édité 1 fois

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par Matriochka le Mer 20 Mar 2013 - 19:07

Big rappel des règles :
Je vous rappelle qu'il est autorisé un seul UP par tranche de 24 heures, à partir de votre dernier message posté dans le sujet concerné.

Je vous invite à lire :

A bientôt sur ForumActif Smile

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Mer 20 Mar 2013 - 19:21

Bonjour,
désolée Matriochka... Sad

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Jeu 21 Mar 2013 - 12:53

Si quelqu'un a une réponse, merci d'avance ^^

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par kitelnewbba le Jeu 21 Mar 2013 - 13:21

Bonjour, désolé de l'incruste, j'essaye de t'apporter une aide si besoin ^^ Vérifie sur ce lien si tu trouves ton bonheur pour voir : http://forum.forumactif.com/t324078-gerer-le-contenu-d-un-panneau-lateral

Si oui, dit moi en des nouvelles! Very Happy J'ai hâte.

Cdlt, Jayson

kitelnewbba
****

Masculin
Messages : 314
Inscrit(e) le : 19/09/2012

http://www.habbstyle.com
kitelnewbba a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Jeu 21 Mar 2013 - 18:07

Bonjour,
Je voudrai le genre de code pour faire l'exemple car je n'ai pas tout à fait comprit ^^

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par Matriochka le Ven 22 Mar 2013 - 8:25

Bonjour November,

Il faut passer par les templates pour ça. Va dans Panneau d’admin > Affichage > Templates > Général. Ouvre le template overall_header, et trouves ceci :
Code:
    <body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
Juste après, ajoute ton icône en lui donnant une class afin de pouvoir la modifier comme tu veux via CSS :
Code:
<a href="URL"><img src="URL" class="head_icone1" /></a>

Si on décortique le code :
<a href="URL"><img src="URL" class="head_icone1" /></a>
En bleu : le lien où mène l’icône,
En rouge : le lien de l’image de l’icône,
En vert : la class (le nom) de l’icône.

Une fois que tu as installé ton icône, va dans Panneau d’administration > Affichage > Couleurs > Feuille de styles CSS. Là, on pourra maintenant appliquer du style sur head_icone1, donc notre première icône amovible.

Voici une base que tu pourras utiliser et modifier à ton besoin :

Premier code, icône par défaut :
Code:
/* Icône 1 cachée, sans survol */
.head_icone1 {
top:50px; /* disposition par rapport au haut de page */
left:10px; /* disposition par rapport à la gauche de la page */
position:absolute; /* élément flottant */
-moz-transition:all 0.5s; /* transition Mozilla Firefox */
-webkit-transition:all 0.5s; /* transition Safari et Google Chrome */
-o-transition:all 0.5s; /* transition Opera */
transition:all 0.5s; /* transition défaut */}
Second code, icône survolée :
Code:
/* Icône 1 découverte, au survol */
.head_icone1:hover {
top:50px; /* disposition par rapport au haut de page */
left:100px; /* disposition par rapport à la gauche de la page */
position:absolute; /* élément flottant */}
Donc concrètement, je t’explique :
Dans le premier code, on déplace donc notre image de manière à ce qu’elle vienne se placer sur la gauche du forum et pour qu’elle soit partiellement cachée. Dans le second code, on lui permet, avec un effet de transition, de se déplacer lorsque le curseur de la souris passe dessus. Selon la largeur de l’image que tu utilises, il faudra évidemment régler les valeurs attribuées à left dans les deux codes.

Pour ajouter d’autres images, c’est simple, tu refais cette même manœuvre (modif template + ajout CSS) autant de fois que tu veux, en modifiant toujours la valeur attribuée à top pour éviter que les icônes ne se chevauchent.

Exemple. Mon icône 1 est à 50 pixels du haut, donc mon icônes 2 sera à 100 pixels, et ma troisième à 150, etc.

N’hésite pas si tu as des questions Wink

Matriochka
+ Hyperactif +

Messages : 7604
Inscrit(e) le : 14/07/2010

Matriochka a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Annonce qui s'affiche dès que passe la souris

Message par NovemberGrW le Ven 22 Mar 2013 - 16:22

Merci c'est exactement ce qu'il me fallait, merci encore Very Happy

NovemberGrW
**

Féminin
Messages : 67
Inscrit(e) le : 03/03/2013

http://le-graph-forever.forumactif.org
NovemberGrW a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum