Délai sur effet javascript

Version imprimable

19/08/2013, 10h08
nogir

Délai sur effet javascript

Bonjour,
j'ai appliqué un effet sur une image (explode), cette image cliquée envoie sur un autre site.
J'aimerai que l'effet explode soit vu en totalité avant que l'action du lien ne se déclenche.
Est ce possible et si oui avec quel code ?
Merci d'avance
19/08/2013, 10h16
SpaceFrog

Il existe des milliers de plugins d'effets sur les images, certains gèrent un callback, d'autres non ...

Sans savoir quel code tu utilises ...
19/08/2013, 10h22
nogir

Merci pour la réponse,
je suis plutôt débutant. L'effet est en javascript, l'image dans une div.
Cordialement,
19/08/2013, 10h24
SpaceFrog

Au risque de me répéter :
Sans voir le code de l'effet, ou avoir un lien vers une page ou l'effet est actif ...

OK, pas saisi !!
j'ai essayé ça mais le lien se déclenche sans délai.

Code:

1
2
3
4
5
6
7
8
9
10
11
<script>
$( document ).click(function() {
$( "#pierre" ).toggle( "explode" );
$("#pierre").fadeIn(2800);
setTimeout(function() {
document.location.href = <a href="http://www.madagemstones.com"</a>;
}, 1000);
 
};
});
</script>

19/08/2013, 10h42
SpaceFrog
ha ben avec un petit bout de code on voit qu'il s'agit de jquery
=> il y a un forum jquery ...

Ensuite en jquery il existe des callbacks ...

par contre je ne comprend pas ton enchainement explode fadeIn ...

Pour en revenir au "callback", il s'agit d'une fonction qui sera lancée une fois la methode de jquery achevée ...

ainsi tu peux sur le callback du fadeIn lancer ton changement de page :
Code:

1 2 3 $(document).click(function() { $( "#pierre" ).toggle( "explode" ).fadeIn(2800,function(){self.location.href="http://www.google.fr"}); })

Le fadin est pour faire réapparaître l'image après explode .
J'en suis là :
Code:

1 2 3 4 5 6 7 8 9 <script> $( document ).click(function() { $( "#pierre" ).toggle( "explode" ); $("#pierre").fadeIn(2800); $( "#pierre" ).toggle( "explode" ).fadeIn(2800,function(){self.location.href="http://www.google.fr"}); }) }); </script>
Code:

<div align="center"><img src="images/pierre.png" name="pierre" width="120" height="120" id="pierre" /></div>

Mais plus rien ne se passe, où ai-je commis la fève stp ?

Code:

1
2
3
4
5
6
7
<script>
$( document ).click(function() {
$( "#pierre" ).toggle( "explode" ).fadeIn(2800,function(){self.location.href="http://www.google.fr"});
});
 
 
</script>

19/08/2013, 11h23
nogir

Merci très beaucoup !! Vu l'erreur.
Une dernière chose, j'aimerai que le lien s'ouvre dans un nouvel onglet.
J'ai essayé blank à la place de self, mais apparemment ce n'est pas ça ?
Merci encore

target ne sert a rien car la lien est ouvert dynamiquement avec js et pas avec le href ...
Code:

1 2 3 4 5 <script> $( document ).click(function() { $( "#pierre" ).toggle( "explode" ).fadeIn(2800,function(){window.open("http://www.google.fr"); }); </script>

19/08/2013, 12h18
nogir

Bon, j'ai mis ça ;

Code:

$("#pierre").toggle( "explode" ).fadeIn(2000,function(){window.open("http://www.madagemstones.com")});

ça fonctionne,
merci pour tout