bouton changeant au passage de la souris

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

Résolu bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 19:11

Bonjour/ bonsoir !

J'ai suivi ce tutoriel en ce qui concerne l'animation (très sobre) de ma barre de navigation, et je me demandais s'il était possible d'obtenir le même effet pour des boutons, par exemple "éditer" et "supprimer" se trouvant en haut des messages, ou le petit "mp" dans le profil....

J'ai essayé dans le code de remplacer "#i_icon_mini_index" etc par "#i_icon_edit" ou "#i_icon_delete" (oui c'est du bricolage dwarf ), mais cela ne fonctionne pas...
(ce qui donne ça):
Code:
/*BOUTON SUPPRIMER*/
#i_icon_delete{
  background-image:url('http://i36.servimg.com/u/f36/12/56/43/35/suppri10.png');
  width:78px;
  height:26px;}

#i_icon_delete:hover{
  background-image:url('http://i46.servimg.com/u/f46/12/56/43/35/suppri10.png');
  width:78px;
  height:26px;}
Ai je fait une erreur ?
Sinon, y a t il un autre moyen d'obtenir le même effet ?


Dernière édition par MlleAlys le Lun 5 Nov 2012 - 2:02, édité 3 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: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 19:17

Bonjour,

Je n'ai pas vérifié, mais il me semble que ces boutons soient des images et non des background. Donc tout background que tu appliqueras sera sous l'image en question.

Voici une technique parmi d'autres.

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 19:25

j'avais retiré le bouton de ma liste d'images, comme dans le cas de la barre, mais l'image n’apparaît alors tout simplement pas...

merci pour le lien, je vais aller voir =)

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 19:28

Ha, mais en ce cas qu'est-ce qui porte l'ID "i_icon_delete" ? Elles ne sont pas directement sur les images ? Dans ce cas elles ne sont carrément pas ciblées.

Sinon, par défaut il s'agit d'un élément inline, donc tu ne peux pas leur attribuer de hauteur ni de largeur, donc en l'absence d'image pour "faire" son contenu, ton élément fait 0×0px. Ajoutes donc ceci :

Code:
#i_icon_delete { display: inline-block }

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 19:36

comme ça ?
Code:
#i_icon_delete{
  background-image:url('http://i36.servimg.com/u/f36/12/56/43/35/suppri10.png');
  display: inline-block;
  width:78px;
  height:26px;}

#i_icon_delete:hover{
  background-image:url('http://i46.servimg.com/u/f46/12/56/43/35/suppri10.png');
  display: inline-block;
  width:78px;
  height:26px;}

parce que ça ne marche pas =S


ps : le lien que tu avais mis au dessus... je n'ai pas tout compris, sauf une partie, mais qui ne concerne que les images non transparentes T-T

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 19:41

Parce que tu as dû supprimer l'image et que c'est elle qui porte l'id. Donc sans image, #i_icon_delete ne cible rien du tout. Mets-y une image "vide" de 78×26px, et ça résoudra le problème.

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 19:52

j'ai essayé aussi, mais aucune image ne s'affiche

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 21:01

Donne le lien vers une des pages concernées s'il te plaît

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 21:08

http://estrelane.forumactif.com/t5-modele-de-la-fiche-de-presentation

(mais il me semble quel les boutons éditer et supprimer ne sont pas visibles par les invités... Sinon, peut être en postant un sujet en tant qu'invité dans le foum questions : http://estrelane.forumactif.com/f7-questions-et-suggestions ? )

là j'ai remis l'image de départ des boutons, mais j'ai gardé le css du bouton supprimé qui ne fontionne pas (aucune image n’apparaît en dessous de la première).

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 21:18

Je n'ai aucun bouton non ; crée un compte factice (genre test/test) que tu supprimeras ensuite, que je puisse voir Wink

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 21:23

moi ? je ne comprends pas, si je suis celle qui crée le compte, vous ne pourrez pas voir les boutons non plus, si ? ^^"


EDIT : j'ai modifié les permissions, les invités peuvent normalement éditer leurs messages dans ce forum ^^"

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par Manumanu le Jeu 1 Nov 2012 - 21:28

Le principe c'est que je me connecte ensuite à ce compte pour pouvoir les voir, justement. Wink

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Jeu 1 Nov 2012 - 21:49

même maintenant on ne voit pas de boutons dans la partie invités ?

(je galère à faire le compte, ça fait dix fois que je recommence pour des raisons diverses et variées, mais je vais y arriver ! ^^")


EDIT : mp envoyé

MlleAlys
+ Hyperactif +

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

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

Résolu Re: bouton changeant au passage de la souris

Message par MlleAlys le Sam 3 Nov 2012 - 15:09

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: bouton changeant au passage de la souris

Message par MlleAlys le Lun 5 Nov 2012 - 1:06

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: bouton changeant au passage de la souris

Message par Scoubifitz le Lun 5 Nov 2012 - 1:45

bonjour,

les boutons de message ont des class , pas des id ...

remplacez les dièses par des points :

Code:
/*BOUTON SUPPRIMER*/
.i_icon_delete{
background-image:url('http://i36.servimg.com/u/f36/12/56/43/35/suppri10.png');
width:78px;
height:26px;}
       
.i_icon_delete:hover{
background-image:url('http://i46.servimg.com/u/f46/12/56/43/35/suppri10.png');
width:78px;
height:26px;}

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: bouton changeant au passage de la souris

Message par MlleAlys le Lun 5 Nov 2012 - 2:02

impec, merci beaucoup !!! Very Happy

je mets le sujet en 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