[css] Logo du forum qui change ON HOVER

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

Résolu [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 7:02

Bon ce sera mon dernier message pour ce soir Smile

J'aimerai savoir comment était-il possible que lorsque l'on survol le logo du forum, un autre logo apparaisse avec un effet de transition d'opacité. C'est pour créer un effet d'aura autour du logo.

Ce serait génial merci Smile


Dernière édition par LuciDreams le Lun 20 Fév 2012 - 22:37, édité 1 fois

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 9:10

Bonjours,

J'ai fait cela vite... Mais je ne suis pas sur que j'ai le bon id pour avoir fait cela Mais faut essayer Wink !

Pour ton image de départ celle de base prend ce code:
Code:
<img src="ma_tete.png" width="400" height="507" alt="Ma tête" title="Ma tête" />
Mais remplace les liens Wink !

Dans ton CSS place:
Code:
a:hover {
color:red;
text-decoration:none;
background-image:url(images/gris_anim.gif);
background-repeat:no-repeat;
}


Dernière édition par Webmestre_pro le Sam 18 Fév 2012 - 9:16, édité 1 fois

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 9:15

merci mais je ne pense pas, en fait, je voudrai que ce soit une autre image qui s'affiche lorsque le logo est survolé, ce qui induit que le code doit au moins contenir une URL d'image. L'aura est créé par l'image, je veux juste le code qui permet la transition entre ces deux images, au niveau du logo du forum. Donc il doit falloir en plus spécifier au css qu'on veut que ce soit le logo du forum qui change et pas le reste ^^ sinon merci Smile

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 9:17

@LuciDreams a écrit:merci mais je ne pense pas, en fait, je voudrai que ce soit une autre image qui s'affiche lorsque le logo est survolé, ce qui induit que le code doit au moins contenir une URL d'image. L'aura est créé par l'image, je veux juste le code qui permet la transition entre ces deux images, au niveau du logo du forum. Donc il doit falloir en plus spécifier au css qu'on veut que ce soit le logo du forum qui change et pas le reste ^^ sinon merci Smile



Salut j'ai réditer mon post quand tu as poster car javais oublier un code Wink !

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 9:25

Je ne peux pas manipuler le html et je m'attend à un code du style (DANS MON LANGAGE) haha du css custom :

Code:

.id:logoforum {
quand image logo survolée
change logo -> image URL (logo2)
effet : transition, opacity alpha 30% - anim:2s
quand image plus survolée
Transition inverse }
Qui comprendra ? xD

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 9:29

@LuciDreams a écrit:Je ne peux pas manipuler le html et je m'attend à un code du style (DANS MON LANGAGE) haha du css custom :

Code:

.id:logoforum {
quand image logo survolée
change logo -> image URL (logo2)
effet : transition, opacity alpha 30% - anim:2s
quand image plus survolée
Transition inverse }
Qui comprendra ? xD



BEn les code que je tes donner c'est bon mais le lien HTML faut le placer dans un template mais je suis en ce moment en train de chercher le ou il faut le mettre dans le template laisse moi deux minute Wink !

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 9:30

Noooon ! Sur Invision, les templates ne sont pas accessibles ... ^^'

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 9:34

Ha merde je pensaia que tu étais un phpBB2 Ha laisse alors Razz !

Je suis désoler ....

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 9:35

Merci d'avoir essayé Wink

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 10:23

Voila avec des recherche je crois avoir trouver Wink

Dans votre CSS placer les code:

Code:
#logo{
  background:url(image_de_fond.png);
  width:taille de l'image;
  height:taille de l'image;
}
a:hover{
background:url(image_de_fond.png);
  width:taille de l'image;
  height:taille de l'image;
}



Je suis sur que mon CSS est bon .. Mais pour le premier code je crois que je me suis tromper de id peut etre que ce n'est pas #logo je sais pas mais essaie voir Wink !

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 10:40

L'id effectif est i_logo

EDIT : Le ahover se faisait sur tout les liens. Je l'ai donc retiré.


Dernière édition par LuciDreams le Sam 18 Fév 2012 - 10:46, édité 1 fois

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 10:45

HA okay me semblais aussi que c'était cela Wink !... Alors ça fonctionne ?

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 10:47

Post édité, non désolé, la partie css i_logo ne changeait rien et ne servait à rien, puisqu'elle n'aurait fait que recouvrir celui qui est déjà la (et que si l'on supprime déforme le forum)

Et la partie css pour le survol était effectif sur tout les liens

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Invité le Sam 18 Fév 2012 - 10:53

Ben la je ne sais plus toute mes ressource son épuiser Razz !

Invité
Invité


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

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par LuciDreams le Sam 18 Fév 2012 - 10:54

Haha bien merci en tout cas pour ton initiative. J'attendrai des réponses d'un spécialiste de forumactif ^^

LuciDreams
***

Messages : 132
Inscrit(e) le : 07/02/2012

http://www.lucidreams.fra.co
LuciDreams a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par piman le Sam 18 Fév 2012 - 12:20

Bonjour !
Je cherchais justement à créer cet effet pour mon design, mais grâce à ce qu'avait mis Webmestre_pro je me suis fais moi-même un code css pour y parvenir.

Le voici :
Code:
body   {
background:url(LIEN DE TON IMAGE); /* l'image qui s'affiche au début*/
background-color: #EBECAD; /* la couleur de fond de ton forum*/
  background-repeat:no-repeat;
  background-position: top center;
  position: center;
}
body:hover
{background:url(LIEN DE TON IMAGE); /* l'image qui apparaît*/
  background-color: #EBECAD; /* la couleur de fond de ton forum*/
background-repeat:no-repeat;
  background-position: top center;
  position: center;
}

Par contre, il n'y a pas l'effet de transition (que je veux aussi) mais j'y travaille ^^
J'espère que c'est ce que tu voulais, moi ça marche très bien en tout cas =)

piman
**

Féminin
Messages : 98
Inscrit(e) le : 27/04/2011

http://shadowofdeath.forumactif.com
piman a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par Manka77 le Sam 18 Fév 2012 - 13:25

Bonjour LuciDreams,

Pour que tu logo change lors du hover, il suffit de rajouté la class suivante:
Code:

logo:hover { }

A toi ensuite de paramétré tes propriétés dedans.
RAPPEL: Il n'est pas bon de rajouté des Hover sur des logos car je rappel que les Utilisateurs utilisant IE ne verront pas le Hover car celui-ci n'est pas prie en charge par IE.

Cordialement
Manka

Manka77
*****

Masculin
Messages : 580
Inscrit(e) le : 20/12/2008

http://forum.forumactif.com
Manka77 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par piman le Sam 18 Fév 2012 - 13:37

Ah oui ! Moi je t'ai donné pour le fond parce que j'ai une bannière de fond sur mon forum ^^'
Mais ça marche de la même manière pour les deux ! Merci Manka =)

piman
**

Féminin
Messages : 98
Inscrit(e) le : 27/04/2011

http://shadowofdeath.forumactif.com
piman a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [css] Logo du forum qui change ON HOVER

Message par MadDev le Lun 20 Fév 2012 - 12:44

Pour l'auteur du topic :



bonjour

votre problème a t il été résolu ?

si c'est le cas merci d'éditer votre message en cliquant sur et mettre l'icone .

MadDev
Dévactif
Dévactif

Masculin
Messages : 1635
Inscrit(e) le : 19/02/2007

http://forum.forumactif.com
MadDev 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