javascript - animation au clique de la souris.

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

Résolu javascript - animation au clique de la souris.

Message par Invité le Mar 2 Avr 2013 - 18:40

Bonjour,

→ adresse du forum : http://assassinscreed-evol.forumactif.org/
→ version phpBB2.
→ fondatrice du forum.
→ j'utilise chrome & firefox.

Déjà, merci du temps que vous allez m'accorder.
Mon problème réside dans un code javascript que j'ai ajouté au forum. il s'agit d'un code pour des légendes coulissantes. l'animation se déclenche au passage de la souris. mais pour des soucis pratiques, j'aimerais que l'animation se déclenche au clique de la souris. étant donné que je suis nulle en javascript, je fais appelle à vous.

le code javascript
Code:
$(document).ready(function(){

$('.boite.legendecachee').hover(function(){

$(".anim", this).stop().animate({top:'0px'},{queue:false,duration:160});

},function(){

$(".anim", this).stop().animate({top:'45px'},{queue:false,duration:160});

});//

});

le code css
Code:
/* LEGENDE COULISSANTE */
.boite{position:relative; right:10px;
width:150px;
height:58px;
float:left;
background-color:#CCCDCE;
overflow:hidden;
padding-top:2px;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;}

.legende{position:absolute;
background-color:#CCCDCE;
top:45px;
height:58px;
width:146px;
left:0; padding-top:2px; padding-right:2px; padding-left:2px;
line-height:normal;
overflow:auto;}

et le code html situé dans templates → gérénal → index_box
Code:
<div class="boite legendecachee" style="margin-bottom:5px;">
    <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
          <div class="legende anim">
                  <span class="gensmall"><i>passe ta souris !</i><br/>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span>
          </div>
</div>

merci.


Dernière édition par poofpie le Mer 3 Avr 2013 - 12:07, édité 1 fois

Invité
Invité


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

Résolu Re: javascript - animation au clique de la souris.

Message par Arlem le Mar 2 Avr 2013 - 18:47

Bonjour Smile

Essayez en remplaçant :
Code:
$('.boite.legendecachee').hover(function(){
Par :
Code:
$('.boite.legendecachee').click(function(){

Arlem
+ Hyperactif +

Messages : 2550
Inscrit(e) le : 30/06/2009

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

Résolu Re: javascript - animation au clique de la souris.

Message par Invité le Mar 2 Avr 2013 - 18:56

bonjour arlem,

j'ai fait le changement dans le code javascript. malheureusement, ça ne fonctionne pas. l'animation ne marche pas du tout.

merci de m'avoir accorder un peu de temps. (:

Invité
Invité


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

Résolu Re: javascript - animation au clique de la souris.

Message par Arlem le Mer 3 Avr 2013 - 11:20

Effectivement, j'avais mis un peu trop d'espoir dans le fait que ça marche. Razz

Essayez en remplaçant le code JS par celui-ci :
Code:
$(document).ready(function() {
   $('.boite.legendecachee').click(function() {
      $(".anim", this).stop().animate( {top:'0px'}, {queue:false,duration:160});
   });
});

Arlem
+ Hyperactif +

Messages : 2550
Inscrit(e) le : 30/06/2009

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

Résolu Re: javascript - animation au clique de la souris.

Message par Invité le Mer 3 Avr 2013 - 12:07

yeah, ça marche ! un grand merci !
je vote pour ce message. (:

Invité
Invité


Invité 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