J'ai perdu le visuel du "survol"

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

Résolu J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 12:06

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 22/09/15
Lien du forum : http://www.petitefeuille.net/

Description du problème

Bonjour,

J'ai installé une bannière défilante suite à ce tuto, je l'ai modifier pour la vitesse en me servant de ce tuto et là je n'ai plus la fonction de survoler l'image (l'effet loupe) .

Pouvez-vous m'aider s'il vous plait?

Merci d'avance, mes amitiés

petitefeuille

voici le CSS:

Code:
          /*Hauteur du menu*/
        .M14_pa { height:100px;background:#FFFFFF0;}
        /*Position des images dans le menu*/
        .M14_pa img{padding-top:30px;padding-left:10px;cursor:pointer;}
        /*Effet au survol des images avec reprise des tailles originales*/
        .M14_pa img:hover{padding-top:0;width:150px; height:104px;} 

voici le code Message sur la page d'accueil
Code:

<div align="center">
    <a href="http://www.petitefeuille.net/t9625-faites-vous-des-efforts-pour-lutter-contre-le-rechauffement-climatique"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/68971910.jpg" title="La question du jour" /></a>  <a href="http://www.petitefeuille.net/t9687-laffaire-volkswagen-prend-une-dimension-mondiale"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/index10.jpg" title="L’affaire Volkswagen prend une dimension mondiale" /></a> <a href="http://www.petitefeuille.net/t9658-des-chercheurs-francais-produisent-les-premiers-spermatozoides-in-vitro"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/index11.jpg" title="Des chercheurs français produisent les premiers spermatozoïdes in vitro" /></a>  <a href="http://www.petitefeuille.net/t9610-le-film-human"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/57450910.jpg" title="LE FILM HUMAN" /></a>  <a href="http://www.petitefeuille.net/t9688-comment-ikea-se-transforme-en-cauchemar-pour-les-couples"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/rtr4na10.jpg" title="Comment Ikea se transforme en cauchemar pour les couples" /></a>  <a href="http://www.petitefeuille.net/t9692-comment-les-energies-vertes-font-leur-chemin-dans-les-campagnes-francaises"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/index11.jpg" title="Comment les énergies vertes font leur chemin dans les campagnes françaises " /></a>  <a href="http://www.petitefeuille.net/t9689-tennis-noah-nouveau-capitaine-de-lequipe-de-france-de-tennis"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/index12.jpg" title="Noah, nouveau capitaine de l’équipe de France de TENNIS" /></a>  <a href="http://www.petitefeuille.net/t6409-les-images-insolites"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/images10.jpg" title="Les images insolites" /></a>
</div>


Dernière édition par petitefeuille le Mer 23 Sep 2015 - 15:49, édité 1 fois

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par Neptunia le Mar 22 Sep 2015 - 12:19

Bonjour ^^

Le CSS ne fonctionne plus puisque le code HTML n'utilise plus la classe M14_pa

Essayez de remplacer dans le code html :
Code:
<div align="center">
par
Code:
<div class="M14_pa" align="center">

Neptunia
+ Hyperactif +

Féminin
Messages : 10392
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 12:24

Bonjour Neptune-

merci beaucoup, je viens de faire la modif et rien ne se passe quand je survole avec la souris, je suis sous windows8 si cela peut vous aider Smile

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: J'ai perdu le visuel du "survol"

Message par Neptunia le Mar 22 Sep 2015 - 12:37

Désolé, je crains de ne pas pouvoir aider davantage Sad

Neptunia
+ Hyperactif +

Féminin
Messages : 10392
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 12:39

pas de souci Neptune- merci tout de même Flowers2

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: J'ai perdu le visuel du "survol"

Message par Milouze14 le Mar 22 Sep 2015 - 15:18

Salut petitefeuille,

il n'y a pas de balise marquee autour de la div.
Ton code html doit être comme ceci:
Code:
<marquee scrollamount="2">
   <div class="M14_pa" align="center">
          <a href="http://www.petitefeuille.net/t9625-faites-vous-des-efforts-pour-lutter-contre-le-rechauffement-climatique"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/68971910.jpg" title="La question du jour" /></a>  <a href="http://www.petitefeuille.net/t9687-laffaire-volkswagen-prend-une-dimension-mondiale"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/index10.jpg" title="L’affaire Volkswagen prend une dimension mondiale" /></a> <a href="http://www.petitefeuille.net/t9658-des-chercheurs-francais-produisent-les-premiers-spermatozoides-in-vitro"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/index11.jpg" title="Des chercheurs français produisent les premiers spermatozoïdes in vitro" /></a>  <a href="http://www.petitefeuille.net/t9610-le-film-human"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/57450910.jpg" title="LE FILM HUMAN" /></a>  <a href="http://www.petitefeuille.net/t9688-comment-ikea-se-transforme-en-cauchemar-pour-les-couples"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/rtr4na10.jpg" title="Comment Ikea se transforme en cauchemar pour les couples" /></a>  <a href="http://www.petitefeuille.net/t9692-comment-les-energies-vertes-font-leur-chemin-dans-les-campagnes-francaises"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/index11.jpg" title="Comment les énergies vertes font leur chemin dans les campagnes françaises " /></a>  <a href="http://www.petitefeuille.net/t9689-tennis-noah-nouveau-capitaine-de-lequipe-de-france-de-tennis"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/index12.jpg" title="Noah, nouveau capitaine de l’équipe de France de TENNIS" /></a>  <a href="http://www.petitefeuille.net/t6409-les-images-insolites"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/images10.jpg" title="Les images insolites" /></a>
   </div>
                    
</marquee>

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

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

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 15:25

Bonjour Milouze14,

En fait je ne la fait pas défilante, mais ça ne change pas le problème pour le lien survolé, rien ne se passe, que se soit avec ou sans la balise "marquee" et ce qui est bizarre, sans modif en prenant le code d'origine ça marche bien, donc où est le problème ? je bataille, mais je ne comprends pas !


Code:
<div class="M14_pa" align="center">
           <a href="http://www.petitefeuille.net/t9694-selon-vous-depuis-5-ans-votre-niveau-de-vie-a-t-il"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/0a949511.jpg" title="La question du jour" /></a>  <a href="httphttp://www.petitefeuille.net/t9695-jean-mercier-87-ans-juge-pour-avoir-aide-sa-femme-a-mourir"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/jean-m10.jpg" title="Jean Mercier, 87 ans, jugé pour avoir aidé sa femme à mourir " /></a>  <a href="http://www.petitefeuille.net/t9687-laffaire-volkswagen-prend-une-dimension-mondiale"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/index10.jpg" title="L’affaire Volkswagen prend une dimension mondiale" /></a> <a href="http://www.petitefeuille.net/t9696-un-guide-du-routard-dessine-pour-accompagner-les-refugies-a-leur-arrivee-en-france"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/refugi11.jpg" title="Un " guide="" du="" routard"="" dessiné="" pour="" accompagner="" les="" réfugiés="" à="" leur="" arrivée="" en="" france"="" /></a>  <a href="http://www.petitefeuille.net/t9610-le-film-human"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/57450910.jpg" title="LE FILM HUMAN" /></a>  <a href="http://www.petitefeuille.net/t9688-comment-ikea-se-transforme-en-cauchemar-pour-les-couples"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/rtr4na10.jpg" title="Comment Ikea se transforme en cauchemar pour les couples" /></a>  <a href="http://www.petitefeuille.net/t9697-ce-chien-a-fait-une-betise-et-s-excuse-d-une-maniere-inattendue"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/captur20.png" title="Ce chien a fait une bêtise et s'excuse d'une manière inattendue" /></a>  <a href="http://www.petitefeuille.net/t9689-tennis-noah-nouveau-capitaine-de-lequipe-de-france-de-tennis"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/index12.jpg" title="Noah, nouveau capitaine de l’équipe de France de TENNIS" /></a>     
</div>

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par Milouze14 le Mar 22 Sep 2015 - 15:50

Re,

effectivement car ton code html fonctionne parfaitement sur mon fofo de test avec la css associée.
As tu apporté quelque chose récemment sur ton forum ?
a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4563
Inscrit(e) le : 18/04/2005

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

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 16:14

@Milouze14 a écrit:Re,

(...)
As tu apporté quelque chose récemment sur ton forum ?
a++

Non je n'ai rien fait depuis que j'ai fait cette bannière, mais je viens de m’apercevoir que juste la dernière image de droite fonctionne sur le survole et pas les autres ! J'ai tout revue et là franchement c'est un casse tête pour moi Sad

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mar 22 Sep 2015 - 16:18

Re .. en faite, en ne mettant pas le lien de l'image(url) , l'image fait loupe, et quand je remets l'URL là ça ne fonctionne plus .......

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 9:07

Bonjour,

Je reviens car là je suis surprise du résultat du code . Je travail comme sur le tuto en m’appliquant de bien faire attention. (voir code N°1)

une fois validé, tout mon code change , pourquoi ? voir mon code N°2 )

Code:
<a href="http://www.petitefeuille.net/t9699-un-poisson-mutant-peche-a-fukushima"><img src="http://i21.servimg.com/u/f21/15/86/06/11/captur27.jpg"width="100" height="72"title="Un poisson mutant pêché à Fukushima"></a>

*****************
Une fois poster et validé :

Code:
<a href="http://www.petitefeuille.net/t9699-un-poisson-mutant-peche-a-fukushima"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/15/86/06/11/captur27.jpg" title="Un poisson mutant pêché à Fukushima" /></a>



Donc une fois validé ça change, pourquoi ?

Je reste à votre disposition, merci d'avance

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 13:05

Bonjour, j'ai essayer plusieurs tutos mais ça ne correspond pas avec ce code mis en place sur mon forum, est-ce qu'une personne peut m'aider a ajouter un code pour "un effet de zoom en css sur image" s'il vous plait ?

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par R-max le Mer 23 Sep 2015 - 14:30

bonjour petitefeuille.

dans votre codage qui est comme ceci >>

Code:
<a href="http://www.petitefeuille.net/t9625-faites-vous-des-efforts-pour-lutter-contre-le-rechauffement-climatique"><img style="width: 100px; height: 72px;" src="http://i21.servimg.com/u/f21/17/08/84/19/68971910.jpg" title="La question du jour" /></a>

viré le style ^^
donc ont arrive a ceci >>

Code:
<a href="http://www.petitefeuille.net/t9625-faites-vous-des-efforts-pour-lutter-contre-le-rechauffement-climatique"><img src="http://i21.servimg.com/u/f21/17/08/84/19/68971910.jpg" title="La question du jour" /></a>

votre css est comme ceci >>

Code:
          /*Hauteur du menu*/
        .M14_pa { height:100px;background:#FFFFFF0;}
        /*Position des images dans le menu*/
        .M14_pa img{padding-top:30px;padding-left:10px;cursor:pointer;}
        /*Effet au survol des images avec reprise des tailles originales*/
        .M14_pa img:hover{padding-top:0;width:150px; height:104px;}

changé le pour celui la >>

Code:
          /*Hauteur du menu*/
        .M14_pa { height:100px;background:#FFFFFF0;}

        /*Position des images dans le menu*/
        .M14_pa img{width:100px;height;72px;padding-top:30px;padding-left:10px;cursor:pointer;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
transition: all 0.7s;}

        /*Effet au survol des images avec reprise des tailles originales*/
        .M14_pa img:hover{padding-top:0;width:150px; height:104px;}

faite un test Wink

R-max
# Tropactif #

Masculin
Messages : 1450
Inscrit(e) le : 08/01/2015

http://graphcode.forumactif.org/
R-max a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:10

Bonjour R-max,
Vous me laisser le temps de le faire de suite et j'arrive ensuite sur ce topic ...... merci Smile

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:32

ça va pas du tout


petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: J'ai perdu le visuel du "survol"

Message par R-max le Mer 23 Sep 2015 - 15:36

rempalcer le css par celui la j'avait fait une erreur
Code:
          /*Hauteur du menu*/
        .M14_pa { height:100px;background:#FFFFFF0;}
 
        /*Position des images dans le menu*/
        .M14_pa img{width:100px;height:72px;padding-top:30px;padding-left:10px;cursor:pointer;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
transition: all 0.7s;}
 
        /*Effet au survol des images avec reprise des tailles originales*/
        .M14_pa img:hover{padding-top:0;width:150px; height:104px;}

R-max
# Tropactif #

Masculin
Messages : 1450
Inscrit(e) le : 08/01/2015

http://graphcode.forumactif.org/
R-max a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:42

par contre le survol marche très bien mais les images font désordres

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:43

@R-max a écrit:rempalcer le css par celui la j'avait fait une erreur
Code:
          /*Hauteur du menu*/
        .M14_pa { height:100px;background:#FFFFFF0;}
 
        /*Position des images dans le menu*/
        .M14_pa img{width:100px;height:72px;padding-top:30px;padding-left:10px;cursor:pointer;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
transition: all 0.7s;}
 
        /*Effet au survol des images avec reprise des tailles originales*/
        .M14_pa img:hover{padding-top:0;width:150px; height:104px;}

oh pardon on a écrit en même temps ... je fais la correction et je reviens


Dernière édition par petitefeuille le Mer 23 Sep 2015 - 15:50, édité 1 fois

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:48

R-max vous êtes un champion, un grand merci à vous , tout fonctionne à merveille et enfin je vais pouvoir arrêter de batailler Smile merci encore et +1 Wink et je clos le sujet.

Je vous souhaite une bonne fin d'après midi

petitefeuile

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par R-max le Mer 23 Sep 2015 - 15:53

de rein et désolé de la petite erreur ,, Razz

R-max
# Tropactif #

Masculin
Messages : 1450
Inscrit(e) le : 08/01/2015

http://graphcode.forumactif.org/
R-max a été remercié(e) par l'auteur de ce sujet.

Résolu Re: J'ai perdu le visuel du "survol"

Message par petitefeuille le Mer 23 Sep 2015 - 15:56

ne vous inquiétez pas pour la petite erreur, vous avez fait un travail excellent Smile merci

petitefeuille
*****

Féminin
Messages : 812
Inscrit(e) le : 01/12/2010

http://www.petitefeuille.net/
petitefeuille 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