Cascade animation : Animation « jQuery « JavaScript Tutorial

JavaScript Tutorial

1.	Language Basics
2.	Operators
3.	Statement
4.	Development
5.	Number Data Type
6.	String
7.	Function
8.	Global
9.	Math
10.	Form
11.	Array
12.	Date
13.	Dialogs
14.	Document
15.	Event
16.	Location
17.	Navigator
18.	Screen
19.	Window
20.	History
21.	HTML Tags
22.	Style
23.	DOM Node
24.	Drag Drop
25.	Object Oriented
26.	Regular Expressions
27.	XML
28.	GUI Components
29.	Dojo toolkit
30.	jQuery
31.	Animation
32.	MS JScript

Java Source Code / Java Documentation

Java Open Source

Jar File Download

Photoshop Tutorials

Flash Tutorials

3ds-Max Tutorials

Illustrator Tutorials

C# / CSharp Tutorial

C# / CSharp Open Source

ASP.NET Tutorial

JavaScript DHTML

JavaScript Reference

HTML CSS Reference

Python Tutorial

Python Open Source

SQL Server / T-SQL

SQL Server / T-SQL Tutorial

Oracle PL / SQL

Oracle PL/SQL Tutorial

VB.Net Tutorial

Flash / Flex / ActionScript

VBA / Excel / Access / Word

Microsoft Office PowerPoint 2007 Tutorial

Microsoft Office Excel 2007 Tutorial

Microsoft Office Word 2007 Tutorial

JavaScript Tutorial » jQuery » Animation

30. 137. 3. Cascade animation


<html>

  <head>

    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>

    <script type="text/javascript">

        $(document).ready(function(){

            $("div").animate( { width:"90%" }, { queue:false, duration:3000 } )

                    .animate( { fontSize:"24px" }, 1500 )

                    .animate( { borderRightWidth:"15px" }, 1500);



        });

    </script>

  <style>

  div { 

    background-color:red; 

    width:500px; 

    height:500px; 

    border:1px solid black;

  }

  </style>

    

  </head>

  <body>

    <body>

          <div>Click me</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

w_w__w_._ja__v_a_2s_._c_o___m__ | Contact Us

Copyright 2009 - 12 Demo Source and Support. All rights reserved.

All other trademarks are property of their respective owners.