A class. Auntion Action var 0.1 that is completed only when flash is used in Javascript.

Source: Internet
Author: User

Please refer to example2.html. The effect in firefox is not rounded up in ie because of compatibility.

DEMO code in pipeline.
It is being modified.
Please follow my blog for consultation on version upgrade information
Http://auntion.blogbus.com
Or add me QQ to ask: 82874972
Action. js
Copy codeThe Code is as follows:
/*
*

Effect type

By Auntion

QQ: 82874972

Blog: Auntion@blogbus.com

Email: Auntion@Gmail.com

No copyright. Use it as needed.

Do not delete this part of comments during use. Thank you!

*
*/


ShowHide = Class. create (); ShowHide. prototype = {status: expRs = {}, initialize: function (ob, endW, endH, effect, step) {this. element = (typeof (ob) = 'object ')? Ob: $ id (ob); if (expRs [ob. id] = null) {expRs [ob. id] = true;} if (expRs [ob. id]) {this. width = this. element. offsetWidth; this. height = this. element. offsetHeight; this. endW = (endW! = Null )? EndW. isZero (): null; this. endH = (endH! = Null )? EndH. isZero (): null; this. effect = (effect! = Null )? Effect: 0; this. step = (step! = Null )? Step 0.075; this. now = [0, 0]; this. tryBug = this. step; this. method, this. goTo; expRs [this. element. id] = false; this. start () ;}, start: function () {switch (this. effect) {case 0: {var method = this. judgment (); this. base (method);} break; case 1: {var method = this. judgment (); this. alpha (method) ;}break; default: {alert ("error: not an available effect! It must be 0 and 1. The default value is 0 "); var method = this. judgment (); this. base (method) ;}}, base: function (method) {this. element. style. overflow = "hidden"; this. goTo = this. create (method) ;}, alpha: function (method, step, Opacity) {alert ("unfinished effect, automatically replaced by the default effect. "); this. goTo = this. base (method) ;}, allIs: function () {this. now [0] + = this. expressions (0, this. endW, this. now [0], this. step); this. now [1] + = this. expressions (0, this. endH, this. now [1], th Is. step); if (this. width> this. endW )? (This. now [0]> (this. endW + this. tryBug): (this. now [0] <(this. endW-this.tryBug) {this. element. style. width = this. now [0] + "px";} if (this. height> this. endH )? (This. now [1]> (this. endH + this. tryBug): (this. now [1] <(this. endH-this.tryBug) {this. element. style. height = this. now [1] + "px";} else {clearInterval (this. goTo); this. element. style. width = (this. now [0] + this. tryBug) + "px"; this. element. style. height = (this. now [1] + this. tryBug) + "px"; expRs [this. element. id] = true ;}, widthIs: function () {this. now + = this. expressions (0, this. endW, this. now, this. step); if (this. wid Th> this. endW )? (This. now> (this. endW + this. tryBug): (this. now <(this. endW-this.tryBug) {this. element. style. width = this. now + "px";} else {clearInterval (this. goTo); this. element. style. width = (this. now + this. tryBug) + "px"; expRs [this. element. id] = true ;}, heightIs: function () {this. now + = this. expressions (0, this. endH, this. now, this. step); if (this. height> this. endH )? (This. now> (this. endH + this. tryBug): (this. now <(this. endH-this.tryBug) {this. element. style. height = this. now + "px";} else {clearInterval (this. goTo); this. element. style. height = (this. now + this. tryBug) + "px"; expRs [this. element. id] = true ;}}, judgment: function () {if (this. endW! = Null & this. endH! = Null) {this. method = "all"; this. now = [this. width, this. height];} else if (this. endW! = Null & this. endH = null) {this. method = "width"; this. now = this. width;} else if (this. endW = null & this. endH! = Null) {this. method = "height"; this. now = this. height;} return this. method ;}, create: function (codeString) {var ShowHideGoTo; switch (codeString) {case "all": ShowHideGoTo = setInterval (function () {this. allIs ();}. bind (this), 1); break; case "width": ShowHideGoTo = setInterval (function () {this. widthIs ();}. bind (this), 1); break; case "height": ShowHideGoTo = setInterval (function () {this. heightIs ();}. bind (this), 1); break;} return ShowHideGoTo;}, expressions: function (num, end, now, step) {var exec; switch (num) {case 0: exec = (end-now) * step; break; default: exec = (end-now) * step; break;} return exec ;}};

Language. js
Copy codeThe Code is as follows:
/*
*
Language extension package

By Auntion

QQ: 82874972

Blog: Auntion@blogbus.com

Email: Auntion@Gmail.com

No copyright. Use it as needed.

Do not delete this part of comments during use. Thank you!

*
*/



Var Class = {create: function () {return function () {this. initialize. apply (this, arguments) ;}}; $ id = function (I) {return document. getElementById (I) ;}; $ name = function (I) {return document. getElementsByName (I) ;}; $ class = function (className, baseId) {var fatherId = null; if (! BaseId) {fatherId = document;} else {var id = baseId; fatherId = $ id (id);} var basic = fatherId. getElementsByTagName ('*') | document. all; var child = null; var classNames = null; var aggregate = []; for (var I = 0; I <basic. length; I ++) {child = basic [I]; classNames = child. className. split (''); for (var j = 0; j <classNames. length; j ++) {if (classNames [j] = className) {aggregate. push (child); break; }}} ret Urn aggregate;}; String. prototype. toInt = function () {return parseInt (this. replace (/[a-zA-Z] +/, '') ;}; Number. prototype. isZero = function () {return (this <0 )? 0: this;}; Function. prototype. bind = function (e) {var md = this; return function () {return md. apply (e, arguments) ;}}; Object. prototype. attachEvent = function (method, func) {if (! This [method]) this [method] = func; else this [method] = this [method]. attach (func) ;}; Function. prototype. attach = function (func) {var f = this; return function () {f (); func ();}};

Example.html
Copy codeThe Code is as follows:
<! 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">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> example1 </title>
<Script src = "Language. js" language = "javascript"> </script>
<Script src = "Action. js" language = "javascript"> </script>
<Style type = "text/css">

*, Body {
Font-family: Arial, Helvetica, sans-serif;
Font-size: 12px;
}

# Main {
Margin: 50px;
Padding: 0px 0px 20px 0px;
Border: solid 1px # cccccc
}

# Button {
Color: # 0099FF;
}

# Button li {
Margin-right: 10px;
Padding: 5px 0 0 0;
Width: pixel PX;
Height: 22px;
Border: solid 1px # cccccc;
Background-color: # eeeeee;
Float: left;
Text-align: center;
}

# Demo {
Margin-top: 20px;
Background-color: # CCCCCC;
Color: # f5f5f5;
Float: inherit;
/* Border: solid 1px # aaaaaa ;*/
}

</Style>
</Head>
<Body>

<Table border = "0" align = "center" cellpadding = "0" cellspacing = "0">
<Tr>
<Td>
<Div id = "button">
<Ul>
<Li id = "a"> restore the initial value </li>
<Li id = "B"> hide </li>
<Li id = "c"> width + 30 </li>
<Li id = "d"> height + 30 </li>
<Li id = "e"> width-30 </li>
<Li id = "f"> high-30 </li>
<Li id = "I"> 600 in width and 100 in height </li>
</Ul>

</Div>
</Td>
</Tr>
</Table>

<Table border = "0" align = "center" cellpadding = "0" cellspacing = "0">
<Tr> <td align = "center" valign = "middle">
<Div id = "demo" style = "height: 200px; width: 200px;"> </div>
</Td> </tr> </table>

<Script language = "javascript" type = "text/javascript">
Var element = $ id ("demo ");

Var width = element. offsetWidth;
Var height = element. offsetHeight;

Alert (width)

Var step = 0.115

Function now (){
This. nowWidth = element. style. width. toInt ();
This. nowHeight = element. style. height. toInt ();
}

$ Id ("a"). onmousedown = function (){

New ShowHide (element, width, height, 0, step );

}

$ Id ("B"). onmousedown = function (){

New ShowHide (element, 0, 0, 0, step );

}

$ Id ("c"). onmousedown = function (){

Var test = new now ();
New ShowHide (element, test. nowWidth + 30, null, 0, step );

}

$ Id ("d"). onmousedown = function (){

Var test = new now ();
New ShowHide (element, null, test. nowHeight + 30,0, step );

}

$ Id ("e"). onmousedown = function (){

Var test = new now ();
New ShowHide (elements, test. nowWidth-30, null, 0, step );

}

$ Id ("f"). onmousedown = function (){

Var test = new now ();
New ShowHide (element, null, test. nowHeight-30, 0, step );

}

$ Id ("I"). onmousedown = function (){

New ShowHide (element, 600,100, 0, step)

}
</Script>
</Body>
</Html>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.