Pb de class sur un bouton

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

Résolu Pb de class sur un bouton

Message par emc2 le Dim 9 Nov 2014 - 20:31

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://forumfrance.forumactif.fr/

Description du problème

Bonsoir,

Toujours dans la catégorie: "J'ai un problème avec mes class !"
Je n'arrive pas à retrouver la class qui correspond au bouton "répondre" lorsque l'on est dans la messagerie privée.
En effet, tant qu'il s'agit de rendre le bouton "répondre" du forum en dynamique, j'utilise ce codde dans mon css:
Code:
.i_reply{
background-image: url('http://i74.servimg.com/u/f74/18/86/39/02/repond10.png');
  width:78px; /* Largeur de l'image */
  height:30px; /* Hauteur de l'image */
}
.i_reply:hover{
background-image: url('http://i74.servimg.com/u/f74/19/04/22/29/repond10.png');
 /* Largeur et hauteur déjà définie dans i-post */
}
Avec bien sûr la désactivation de l'image dans la gestion des images. Malheureusement, cela fait disparaître également le bouton "répondre" de la messagerie, et la class ne semble pas être la même.
Je suis allé voir dans le fichier source, et je n'ai pas su la retrouver. Je pense qu'elle n'est pas mentionnée, ou bien la valeur de cette class doit changer pour chaque message privé.
Quelqu'un peut-il m'aider sur ce problème ? Merci d'avance.


Dernière édition par emc2 le Mer 12 Nov 2014 - 13:05, édité 1 fois

emc2
*****

Messages : 518
Inscrit(e) le : 30/09/2011

http://sainte-croix.forumgratuit.org/
emc2 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Pb de class sur un bouton

Message par Scoubifitz le Dim 9 Nov 2014 - 23:19

bonjour,

on peut aussi utiliser une seule image pour le bouton normal et survolé :



En affichage normal , le haut de l'image apparait . Au survol , le bas de l'image apparait ...

... et s'il n'y a pas de class ou d'identifiant , on peut regarder s'il y a un texte alternatif (alt) ...

Remplacez votre code par celui-ci :

Code:
img[alt="Répondre au sujet"],img[alt="Répondre au message"]{
background: url('http://i59.servimg.com/u/f59/12/14/82/30/repond10.png') top;
width:78px; /* Largeur de l'image */
height:30px; /* Hauteur de la moitié de l'image */
}
img[alt="Répondre au sujet"]:hover,img[alt="Répondre au message"]:hover{
background-position: bottom; /* position du sprite */
/* Largeur et hauteur déjà définie dans i-post */
}

(fonctionne sur phpBB 2 et phpBB 3)

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Pb de class sur un bouton

Message par emc2 le Lun 10 Nov 2014 - 0:35

Cela fonctionne parfaitement, et je rajouterais que la transition me paraît plus douce entre les deux images.
Ce qui m'ennuie, c'est que je n'ai pas bien saisi la mécanique du code.
J'ai compris qu'une seule image où apparaît les deux boutons est placée dans le background sans survol, mais que l'on sélectionne que le haut (top).
Mais quelle est le code qui fait apparaître que le bas de l'image au survol de la souris ?

emc2
*****

Messages : 518
Inscrit(e) le : 30/09/2011

http://sainte-croix.forumgratuit.org/
emc2 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Pb de class sur un bouton

Message par Scoubifitz le Lun 10 Nov 2014 - 0:44

En créant un cadre d'une certaine dimension , et en déplaçant l'image de fond dans ce cadre avec "background-position" ...

pour le bouton normal , on a :
background: url('http://i59.servimg.com/u/f59/12/14/82/30/repond10.png') top;
donc , une image de fond placée par rapport au haut du cadre (et centrée , si ce n'est pas précisé)

pour le bouton survolé :
background-position: bottom;
donc , une image de fond placée par rapport au bas du cadre ...

l'image fait 60 pixels de haut , donc le cadre devra faire 30 pixels de haut ...

vous pouvez tester avec :
background-position: center;
pour le survol , ça permet de mieux comprendre l'effet .

l'avantage est : moins d'images à héberger , l'effet est immédiat .

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Pb de class sur un bouton

Message par emc2 le Mer 12 Nov 2014 - 13:05

C'est limpide ! Je mets en "résolu" le sujet.

emc2
*****

Messages : 518
Inscrit(e) le : 30/09/2011

http://sainte-croix.forumgratuit.org/
emc2 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