Jquery Introduction 4

Today, I went on to discuss Jquery animation processing with you last time. Here I just give examples of some of the commonly used effects. For other graphic processing, I suggest you use html5, let's move on to Jquery's animation processing and ajax processing.
$ ("Div"). next. show ("slow/normal/fast (100 ms)"); // display of the next object of the div
Below is a gradient animation effect
$ ("# Panel h5.head"). toggle (function (){
$ (This). next (). fadeOut ([500]); // You can dynamically set the time unit in milliseconds.
}, Function (){
$ (This). next. fadeIn ([1000]); // enter
});
 
Effect of contraction and expansion
$ (). Ready (function (){
$ ("# Panel"). toggle (function (){
$ (This). slideUp (1000 );
}, Fiunction (){
$ (This). slideDown (1000 );
});
});

----- Animation effects of custom css styles: Animations give life and vitality
$ (Function (){
$ ("# Panel"). click (function (){
// The following method is used to customize the animation effect of an animation: [left: "500px"] // here it refers to the css style + = 500 representation of the combination of multiple name-value pairs, 500 pixels per click
// The second parameter takes 3000 ms after execution.
// The third parameter is the callback function.
$ (This). animate ([left: "+ = 500px"], 3000, function () {alert (3 )});
// Animate ([left: "500px", height: "300px"])
 
// Method chain
$ (This). animate ([left: "500"], 3000, function () {alert ("first coming ")})
Animate ([top: "100"], 300, function () {alert ("second coming" seconds into detail .css ("background", "red ");
// Fourth usage
$ (This). animate ([left: "500"], 3000). animate ([top: "100" comment, function({{}(this}.css ("background", "red ")});
});
})
-------------------------------------------- AJAX request ------------------------------------------
$. Ajax ({
Type: "get/post ",
Http://www.bkjia.com/kf/201203/123609.html request url
DataType: "html/xml/application/json", // response text data format
Data: {"name": "sharme"}, // input parameter data in json format, which can be obtained through getParameter on the server
Success: function (data ){
// Here is the callback function
}
});
 
------------------- Simple AJAX request of Jquery
$. Post ("url", {name: parameter1, age: paramter2}, function (return nData, status ){
// Status indicates the status. If the callback function is successfully called, The status is 2.0.
If (status = 2 ){
Code segment for callback function execution
}
});
 
$. Get ("url", {json format parameter}, function (nData, status ){
If (status = 2 ){
Alert (nData );
}
});
 
-- Note: When we used Javascript for development, the time processing may usually start with on..., but in jquery, the event name does not have on

From sharme's column