modification d'un bouton au passage de la souris

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

Résolu modification d'un bouton au passage de la souris

Message par MlleAlys le Mar 6 Nov 2012 - 22:27

Bonjour/bonsoir !

J'essaye de changer mes boutons fixes par des backgrounds changeant de position au passage de la souris. On m'a déjà aidé pour commencer avec "supprimer" ( http://forum.forumactif.com/t340678-bouton-changeant-au-passage-de-la-souris ) et, faisant désormais attention, j'ai fait de même avec "éditer", "Mp", et "profil", aucun soucis de ce côté.

Je suis alors passée aux boutons "Nouveau sujet", et là, j'ai remarqué que, si c'était toujours la même image, c'était par contre beaucoup de références différentes... Donc, première question :

=> Y a t il un moyen pour récupérer toutes ces références sans devoir parcourir à chaque fois les pages du forum pour les rechercher ? ^^"

De plus, en essayant, je me suis rendue compte que ça ne marchait pas bien pour toutes : certains restent "bloqués" en position "hover", même quand la souris n'est pas dessus... alors que c'est exactement le même code que les autres, pour lesquels ça fonctionne ><" ! Par exemple sur cette page de mon forum, le "Nouveau sujet" du haut est bloqué, alors que celui du bas fonctionne...

=> Pourquoi, et comment corriger ?

Voici mon code css concerné :
Code:
/*nouveau sujet*/
#Newtopic, #one, #i_post, #i_post1{
  background-image:url('http://i46.servimg.com/u/f46/12/56/43/35/nouvea10.png');
  width:150px;
  height:75px;
  background-position : left top;}
#Newtopic, #one, #i_post, #i_post1:hover{
  background-position : left bottom;}

.i_msg_newpost{
  background-image:url('http://i46.servimg.com/u/f46/12/56/43/35/nouvea10.png');
  width:150px;
  height:75px;
  background-position : left top;}
.i_msg_newpost:hover{
  background-position : left bottom;}

Merci d'avance !


Dernière édition par MlleAlys le Jeu 15 Nov 2012 - 16:47, édité 4 fois

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

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

Résolu Re: modification d'un bouton au passage de la souris

Message par demeter1 le Mar 6 Nov 2012 - 23:00

votre hover ne contient aucune image

demeter1
+ Hyperactif +

Masculin
Messages : 8106
Inscrit(e) le : 23/01/2009

http://altitudetropicale.forums-actifs.com/index.forum
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Mar 6 Nov 2012 - 23:03

non, les deux boutons sont sur la même image, et il n'y a que la position qui change... normalement, ce code a fonctionné pour tous les autres, y aurait-il une raison pour qu'il ne fonctionne pas ici ?
D'ailleurs, le bouton est bien bloqué en position "hover" scratch

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

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

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Mer 7 Nov 2012 - 23:20

up

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

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

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Ven 9 Nov 2012 - 0:18

up

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: modification d'un bouton au passage de la souris

Message par Danux le Ven 9 Nov 2012 - 1:09

Bonjour,

C'est normal, vous avez oublier d'indiquer :hover à chaque balide dans votre code CSS :

Code:
#Newtopic, #one, #i_post, #i_post1:hover{
  background-position : left bottom;}
Ici : seul #i_post1 aura le fond changeant au survol.

Pour corriger cela, vous devez préciser :hover à chaque balise (et non juste en fin de ligne, sinon ça ne marche pas) !
Code:
#Newtopic:hover , #one:hover , #i_post:hover , #i_post1:hover {
  background-position : left bottom;}

Danux
****

Masculin
Messages : 329
Inscrit(e) le : 22/07/2009

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

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Ven 9 Nov 2012 - 18:28

aaaaaaaaah ! je ne savais pas mais effectivement réflexion faite c'est logique !
merci ! =D


et concernant la première question, quelqu'un aurait-il une idée ?
@MlleAlys a écrit:Je suis alors passée aux boutons "Nouveau sujet", et là, j'ai remarqué que, si c'était toujours la même image, c'était par contre beaucoup de références différentes... Donc, première question :

=> Y a t il un moyen pour récupérer toutes ces références sans devoir parcourir à chaque fois les pages du forum pour les rechercher ? ^^"
=> Dans le même ordre d'idées, concernant le bouton "Répondre au message", je n'ai trouvé qu'une seule référence, quelles est (sont) l(es) autres(s) (il s'agit les boutons "répondre" en bas des sujets, et de ceux de la messagerie personnelle) ? Ou comment la (les) trouver ?

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

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

Résolu Re: modification d'un bouton au passage de la souris

Message par Danux le Sam 10 Nov 2012 - 13:04

Bonjour,

Il n'y a pas de liste pour tous les codes CSS malheureusement. ^^

Pour le bouton répondre : .i_reply { css }
Et dans la messagerie :
.i_msg_newpost { css } (nouveau message)
En revanche, il n'y a pas de code direct pour le bouton de réponse, mais vous pouvez toujours essayer :
.topic-actions .buttons .post-icon a[href*="privmsg?mode=reply"] { css }

Cordialement

Danux
****

Masculin
Messages : 329
Inscrit(e) le : 22/07/2009

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

Résolu Re: modification d'un bouton au passage de la souris

Message par Anya31 le Sam 10 Nov 2012 - 13:06

@Danux a écrit:Bonjour,

Il n'y a pas de liste pour tous les codes CSS malheureusement. ^^

Pour le bouton répondre : .i_reply { css }
Et dans la messagerie :
.i_msg_newpost { css } (nouveau message)
En revanche, il n'y a pas de code direct pour le bouton de réponse, mais vous pouvez toujours essayer :
.topic-actions .buttons .post-icon a[href*="privmsg?mode=reply"] { css }

Cordialement

oui c'est bien dommage ^^

Anya31
****

Masculin
Messages : 383
Inscrit(e) le : 10/12/2010

http://touslesloulous.forumactif.com/index.htm
Anya31 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Dim 11 Nov 2012 - 15:24

@Danux a écrit:En revanche, il n'y a pas de code direct pour le bouton de réponse, mais vous pouvez toujours essayer :
.topic-actions .buttons .post-icon a[href*="privmsg?mode=reply"] { css }

Merci pour la réponse ! mais j'ai essayé et ça ne fonctionne pas Sad

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

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

Résolu Re: modification d'un bouton au passage de la souris

Message par MlleAlys le Jeu 15 Nov 2012 - 16:45

Le sujet ID/classes des boutons par X-Rayane a eu plus de succès que le mien, mais la réponse est là ! ^^

résolu

MlleAlys
+ Hyperactif +

Messages : 4340
Inscrit(e) le : 12/09/2012

MlleAlys 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