jQuery实现动画效果的简单实例

一、需求原因目前jQuery已经是一个比较成熟的框架了，而且基于他的插件也有上百种，本例我手动用jQuery实现一个动画效果的例子。二、具体实现复制代码代码如下：DOCTYPE html PUBLIC '-//W3C//DTDHTML 4.01 Transitional//EN ' ' http://www .w3。org/TR/html 4/loose。dtd ' html hearteta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8'titlejQuery实现动画效果/titlescript语言='JavaScript'src='http:/jQuery/jQuery-1。7 .1 .量滴js '/脚本样式类型=' text/CSS ' # test { position : relative；宽度宽度：100像素高度：100 pxborder:1px固体# 0050d0背景#光标：指针指针；}/style脚本类型=' text/JavaScript ' $(function(){ $(' # test ').css('optcity '，' 0.5 ')；//设置不透明$('#test ').单击(function(){ $(this)).动画({left:'400px '，height:'200px '，opacity: ' 1 ' }，300).动画({top:'200px '，width:'200px'}，300).fadeOut("慢");});});/script/head body div id=' test '/div/body/html三、运行结果