Nothing left, so I wrote an animation effect that is easier to call.
Function skyanimate (OBJ, options, step, callback) {If (! OBJ) return; var n = 0, Timer = NULL, ostyle = [], De = [], c = [], B = 0; step = {'low ': 100, 'normal': 50, 'fast ': 10} [STEP] | 64; var d = function (x) {return math. SQRT (1-math. pow (X-1), 2)} For (var I in options) {var obj_style = parseint (sky_css (OBJ, I); If (! Obj_style) obj_style = 0; de. push (obj_style) C. push (options [I]-obj_style); ostyle. push (I);} timer = setinterval (function () {If (n> = step) {clearinterval (timer); If (callback & callback instanceof function) callback () ;} B = D (N/step); For (VAR J = 0, Len = de. length; j <Len; j ++) {obj. style [ostyle [J] = de [J] + C [J] * B + 'px';} n ++ ;}, 15) ;} function sky_gettype (o) {var t; Return (t = typeof (O) = 'ob Object '? O = NULL & 'null' | (object. prototype. tostring. call (o )). slice (8,-1): T ). tolowercase ();} function sky_css (O, name) {If (sky_gettype (name) = 'string') {If (O. style [name]) return O. style [name]; If (O. currentstyle) return O. currentstyle [name]; If (document. defaultview) return document. defaultview. getcomputedstyle (O, "") [name];} else if (sky_gettype (name) = 'object') {for (var I in name) {o. style [I] = Name [I] ;}}
HTML:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML xmlns = "http://www.w3.org/1999/xhtml">
Usage:
VaR box = document. getelementbyid ('box'); skyanimate (box, {'top': 200, 'left': 300, 'width': 500, 'height': 400 }, 'low', function () {alert ('Oh yeah !! ')}) // Box is the object to be animated. // {'top': 200, 'left': 300, 'width': 0, 'height ': 0} This is an animation parameter. // 'Low' controls the animation running speed, which can be slow or normal fast. // function () {alert ('Oh yeah !! ')} Specifies the parameter to run after the animation is executed. This parameter is optional.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
