AdTopDown (element_id, imgB_str, imgS_str, {[imgTargetURL], [duration], [delay], [backFn], [isAnimation]}) parameter description: element_id: element Node before advertisement imgB_str: Ad large image imgS_str: Ad small image optional parameter
AdTopDown (element_id, imgB_str, imgS_str, {[imgTargetURL], [duration], [delay], [backFn], [isAnimation]})
Parameter description:
Element_id: Element Node before the advertisement
ImgB_str: large ad Image
ImgS_str: small advertisement Image
Optional parameters:
ImgTargetURL: link address
Duration: animation speed
Delay: stay time
BackFn: callback method after the animation is completed (added in v1.2)
IsAnimation: whether to play an animation (true/false)
Usage:
New AdTopDown ('page', "images/ad/quming_banner_ B .jpg", "images/ad/quming_banner_s.jpg ")
You can also use the following animation effects:
New AdTopDown ('page', "images/ad/quming_banner_ B .jpg", "images/ad/quming_banner_s.jpg ",{
ImgTargetURL: "/quming_index.jspx? Topad ",
BackFn: function (obj ){
Alert ('after the animation is played, I will be output ');
}
});
The following static effect usage:
New AdTopDown ('page', "images/ad/quming_banner_ B .jpg", "images/ad/quming_banner_s.jpg", {isAnimation: false });
The Code is as follows:
/*
* Top drop-down animation advertisement v 1.2 by: dum 2012-03-16
* Element_id: imgB_str \ imgS_str: Ad Image
* Added the callback method backFn.
*/
Var AdTopDown = Class. create ();
AdTopDown. prototype = {
Initialize: function (element_id, imgB_str, imgS_str) {// Constructor
This. elementObj = $ (element_id );
This. imgB_str = imgB_str;
This. options = Object. extend ({
ImgTargetURL: "#", // URL
Duration: 1.2, // animation speed
Delay: 1.0, // stay time
BackFn: function (obj) {}, // callback method after animation is completed
IsAnimation: true // whether to play the animation
}, Arguments [3] || {});
This. scale_str = ""
+ ""
+ ""
This. blindDown_str = ""
+ ""
+ ""
If (this. options. isAnimation ){
This. animation ();
} Else {
This. statics ();
}
},
Animation: function () {// animation display www.2cto.com
New Insertion. After (this. elementObj, this. scale_str );
New Insertion. After ($ ('ad _ index_Scale '), this. blindDown_str );
This. animation_Scale ();
},
Animation_Scale: function (){
New Effect. Scale ('ad _ index_Scale ', 0 ,{
ScaleX: false,
ScaleY: true,
Duration: this. options. duration,
Delay: this. options. delay,
AfterFinishInternal: this. animation_blindown.bind (this)
});
},
Animation_blindown: function (obj ){
New Effect. blindown ('ad _ index_blindown ',{
ScaleX: false,
ScaleY: true,
AfterFinishInternal: this. options. backFn. bind (this)
});
},
Statics: function () {// static display
New Insertion. After (this. elementObj, this. blindDown_str );
$ ('Ad _ index_blinkdown '). setStyle ({marginTop: '10px '});
$ ('Ad _ index_blinkdown '). show ();
}
};
Css used
. Ad_index_Scale,. ad_index_BlindDown {width: 980px; margin: 0 auto; clear: both; overflow: hidden ;}
. Ad_index_Scale {margin-top: 10px ;}
From renwumao.com (Task cat)