I just thought about how jquery was implemented. However, my brother has poor capabilities and cannot study jquery source code. Well, make a simple version by yourself! It seems to be okay. When my brother's capabilities go up, I will try again to optimize it.
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns = "http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv =" content-Type "content =" text/html; charset = gb2312 "/> <title> three-column layout </title> <style> # main1 {margin: 20px auto; width: 200px; background-color: #6c9; overflow: hidden ;}</style> </pead> <body> <input type = "button" value = "slide" onclick = "Animate. slide ('main1', 10) "/> <input type =" button "value =" fadeIn "onclick =" Animate. fadeIn ('main1', 10) "/> <input type =" button "value =" fadeOut "onclick =" Animate. fadeOut ('main1', 10) "/> slide & fadeIn & fadeOut </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
After running, you can see the results.