Essayer de faire une Rotation d'Image (jQuery Animation) au Chargement de la Page de Degré

J'ai un amplificateur bouton que j'aimerais changer dans une certaine mesure lors du chargement de la page. Je suis en train d'utiliser cette bibliothèque jQuery: http://code.google.com/p/jqueryrotate/

Je ne sais pas comment le configurer correctement. J'ai été en mesure d'utiliser le webkit pour faire pivoter l'image, mais je veux qu'il y ait une animation. Si quelqu'un peut me laisser savoir comment utiliser correctement la bibliothèque, je serais grandement apprécier!

Rappelez-vous, j'ai besoin d'avoir la rotation se produisent au chargement de la page. Idéalement, l'animation se répète après 5 à 10 secondes. Réjouissons d'avance de votre aide.

  • avez-vous regardez l'exemple de la page? code.google.com/p/jqueryrotate/wiki/Examples
  • +1 hahhaha nice one
  • ouais, j'ai regardé la page d'Exemple, puisque je ne suis pas un idiot complet. Mais j'ai essayé de dupliquer les exemples et je ne pouvais pas le faire fonctionner. Donc, je ne suis qu'en partie d'un idiot. Merci.
  • Votre projet est maintenant de travail à l'aide de ocergynohtnah de la solution, comme on le voit ici: jsfiddle.net/eYdjW
  • Ne devrait pas avoir besoin de jQuery
InformationsquelleAutor Kevin | 2011-05-13
  1. 4

    tout est mis en place bien sur tonesettings.com/rotate. le seul problème que vous avez est que vous êtes à l'appel de la rotation() la fonction avant que la page a fini de charger. vous pouvez simplement déplacer dans un état prêt et il doit déclencher au chargement de la page.

    Modifier les éléments suivants:

    <script type="text/javascript">
var rotation = function (){
   $("#img").rotate({
      angle:0, 
      animateTo:360, 
      callback: rotation
   });
}
rotation();
</script>

    à:

    <script type="text/javascript">
var rotation = function (){
   $("#img").rotate({
      angle:0, 
      animateTo:360, 
      callback: rotation
   });
}
$(document).ready(function() {
    rotation();
});
</script>

    Espère que cela a aidé!

    • Je pense que le demandeur a abandonné son projet depuis presque 1 an maintenant. Dommage, parce que votre code fonctionne ici: jsfiddle.net/eYdjW
    • 1 an plus tard: Merci pour votre aide. 🙂
    • vous avez sauvé mon temps thx 🙂
    InformationsquelleAutor ocergynohtna
  2. 0

    Nous pouvons être ici toute la journée à essayer de deviner votre animation, mais ici c'est juste jouer avec les valeurs de la liste ci-dessous.

    var rotation = function (){
   $("#img").rotate({
      angle:0, 
      animateTo:360, 
      callback: rotation,
      easing: function (x,t,b,c,d){        //
          return c*(t/d)+b;
      }
   });
}
rotation();
    • t: temps actuel
    • b: valeur du début
    • c: variation De la valeur
    • d: durée
    • Bon je crois que je vais avoir le plus problème est de savoir comment le faire réellement ce code de travail. Auriez-vous l'esprit en regardant le code et expliquer ce que je fais mal? tonesettings.com/rotate
    • - vous l'image a une id "#img" supprimer le hachage et essayez à nouveau, dans jequery juste représente l'Id d'un élément html, par exemple <img id="test" /> aurait $('#test'); comme un sélecteur à-dire ur obtenir un élément par son id.
    • également utiliser un ID unique, ou de l'utilisation de l'attribut de classe hit w3schools.com pour les didacticiels et de ne pas sauter la lecture jusqu'à ce que u comprendre ce qu'ils signifient
    • À l'origine, j'ai ajouté de l'identité sans la table de hachage, depuis que j'ai supposé qu'il devrait fonctionner. J'ai juste changé de nouveau à être sans un # et ça ne fonctionne toujours pas.. des idées?
    • quel message d'erreur avez-vous obtenir?, et avez-vous vérifié que la rotation de script a été injecté b4 de la rotation (fonction)?
    • Je ne reçois pas toutes les erreurs.. et oui la rotation de script est injecté.

    InformationsquelleAutor Val
  3. 0

    veuillez vérifier cela pour j requête de l'image rotation des exemples
    :

    http://code.google.com/p/jqueryrotate/wiki/Examples

    InformationsquelleAutor Ravindra Vemula...