JavaScript fondu dans la fonction
Salut les amis je veux fondu dans une div lorsque je clique sur un autre div et j'en suis à l'aide de code suivant. Code1 fonctionne très bien mais j'ai besoin d'utiliser la Code2.
Je sais qu'il est jQuery, mais j'ai besoin de faire cela en JavaScript
Pouvez-vous me guider que ce genre d'erreur que je fais ou ce que je dois changer...
Code1 --- Fonctionne Très Bien
function starter() { fin(); }
function fin()
{
for (i = 0; i <= 1; i += 0.01)
{
i=Math.round(i*100)/100;
setTimeout("seto(" + i + ")", i * 1000);
}
}
function seto(opa)
{
var ele = document.getElementById("div1");
ele.style.opacity = opa;
}
Code2 --- Ne fonctionne pas
function starter()
{
var ele = document.getElementById("div1");
fin(ele);
}
function fin(ele)
{
for (i = 0; i <= 1; i += 0.01)
{
i=Math.round(i*100)/100;
setTimeout("seto(" + ele + "," + i + ")", i * 1000);
}
}
function seto(ele,opa)
{
ele.style.opacity = opa;
}
Voici un petit bijou qui va vous aider avec ça youmightnotneedjquery.com
toutes les erreurs de la console?
vous devriez vraiment utiliser
toutes les erreurs de la console?
vous devriez vraiment utiliser
setInterval
et clearInterval
à la place. Jetez un oeil à stackoverflow.com/questions/2695462/...OriginalL'auteur kanudo | 2014-04-23
Vous devez vous connecter pour publier un commentaire.
Basé sur cette site
EDIT-1
Ajout de la fonctionnalité de sorte que l'utilisateur peut spécifier l'animation de la durée(@Marzian commentaire)
Vous pouvez essayer ceci:
DÉMO
Oui c'est parce que vous n'avez pas fausser votre onclick function. Ce travail est jsfiddle.net/TH2dn/4
Lire ici stackoverflow.com/questions/9114747/...
juste convertit l'objet d'un certain nombre de sorte que vous pouvez l'ajouter à 0,01
Ajouté animation durée en tant que paramètre à la fonction.
OriginalL'auteur laaposto
c'est avec HTML5; Ici un violon qui a fonctionné pour moi: jsfiddle.net/kychan/esP2z BTW. C'était un fadeOut. Voici un fadeIn exemple: jsfiddle.net/kychan/VP9wJ
Ya @kai cela fonctionne 🙂 mais quand j'ai utilisé des propriétés d'affichage css il n'est pas... exemple @ jsfiddle.net/VP9wJ/1
vous devez simplement supprimer display:none et display:block instructions de votre exemple, et puis le passage de la souris fondu dans les œuvres
OriginalL'auteur Kai
Semble que votre tentative de convertir votre élément, à une chaîne de caractères. Essayez plutôt ceci
Ce qui se passe ici, c'est ce que j'appelle une anonnymous de la fonction lorsque la minuterie de frappe, et à partir de cette fonction, l'exécution de mes functioncall de setto.
Espère que cela aide.
Jonas
setto
doit êtreseto
J'ai essayé aussi mais il ne me donne pas l'effet de fondu. la div va directement visible
Et si le paramètre est se converti à une chaîne, puis le "Code1" ne doit également pas de travail... la seule différence entre les deux le code, c'est que dans "Code1" je suis de passage juste un paramètre sous setTimeout dans "Code2" je suis de passage 2 paramètres
OriginalL'auteur Jonas m
Le problème ici c'est que vous êtes en utilisant le pass-a-méthode de chaîne d'utiliser setTimeout. Qui est fondamentalement juste un caché
eval
.Il est intéressant de noter que c'est une mauvaise pratique, lent artiste, ainsi que le risque pour la sécurité.
(voir questions telles que: setTimeout() avec de la ficelle ou (anonyme) de la fonction de référence? speedwise)
La raison de ce qui est à l'origine de votre problème, c'est parce que
"seto(" + ele + "," + i + ")"
va l'évaluer à"seto('[object HTMLDivElement]', 1)"
. Vous avez vraiment envie de passer à la référence à laele
objet -, mais la valeur est convertie en une chaîne de caractères lorsque vous avez essayé de la concaténation d'un objet dans une chaîne de caractères. Vous pouvez contourner ce problème en utilisant le pass-a-méthode de la fonction de l'aide setTImeout.setTimeout(function() { seto(ele, i); }, i * 1000);
Je crois que ce changement va rendre votre Code2 comportement équivalent à Code1.
OriginalL'auteur sejordan
Ci-dessous sont les réponses à ma question
ANS1 --- DÉMO
ANS2 --- DÉMO
OriginalL'auteur kanudo
Ma version
OriginalL'auteur ShAkKiR