Show the length of the queue. : Animation « jQuery « JavaScript Tutorial






  1. JavaScript Tutorial
  2. jQuery
  3. Animation
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

            $("#show").click(function () {
              var n = $("div").queue("fx");
              $("span").text("Queue length is: " + n.length);
            });
            function runIt() {
              $("div").show("slow");
              $("div").animate({left:'+=20'},2000);

              $("div").hide("slow");
              $("div").show(1200);
              $("div").slideUp("normal", runIt);
            }
            runIt();

        });
    </script>
<style>

  div { margin:3px; width:50px; position:absolute;
        height:50px; left:10px; top:30px; 
        background-color:yellow; }
  div.red { background-color:red; }
  
</style>
  </head>
  <body>
    <body>
        <button id="show">Show Length of Queue</button>
          <span></span>
        
          <div></div>
    </body>
</html>








30.137.Animation
30.137.1.Animation: border width
30.137.2.Animation call back
30.137.3.Cascade animation
30.137.4.Animation in sequence
30.137.5.Animation: easing in
30.137.6.Animation: font size
30.137.7.Animation: height
30.137.8.Linear animation
30.137.9.Animation: movement
30.137.10.Animation: opacity
30.137.11.Animation queue
30.137.12.Animation: show
30.137.13.Animation: toggle
30.137.14.Width changing animation
30.137.15.Stop an animation
30.137.16.Cascade fade out animation
30.137.17.jQuery animation: resize and change color
30.137.18.Animate width and height
30.137.19.Show the length of the queue.
30.137.20.Animates all paragraphs to fade out, completing the animation within 600 milliseconds.
30.137.21.Animates first paragraph to fade to an opacity of 0.33 (33%, about one third visible), completing the animation within 600 milliseconds.
30.137.22.dequeue(): Removes a queued function and executes it.
30.137.23.Use dequeue to end a custom queue function which allows the queue to keep going.
30.137.24.queue() Returns a reference to the first element's queue (which is an array of functions).
30.137.25.queue(callback): Adds a new function, to be executed, onto the end of the queue of all matched elements.
30.137.26.Width animation