编程 Javascript

Jquery实现简单的动画效果代码

Posted in Javascript onMarch 18, 2012

<!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> 
<title></title> 
<script src="http://demo.3water.com/jslib/jquery/jquery-1.7.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
$("#panel").css("opacity", "0.1");//设置透明度 
$("#panel").click(function () { 
$(this).animate({ left: "400px", height: "200px", opacity: "1" }, 3000)//在3秒内向右移动400px,高度放大200px，透明度改为1 
.animate({ top: "200px,width:200px" }, 3000) 
.fadeOut("slow"); //以淡出的方式隐藏 
}); 
}) 
</script> 
</head> 
<body> 
<div id="panel" style=" position:relative; background-color:Olive; height:100px; width:100px; border:1px; border-color:Aqua;"> 
</div> 
</body> 
</html>

Jquery实现简单的动画效果代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JS学习之一个简易的日历控件

Mar 24 Javascript

JS仿百度搜索自动提示框匹配查询功能

Nov 21 Javascript

Jquery实现控件的隐藏和显示实例

Feb 08 Javascript

js动态切换图片的方法

Jan 20 Javascript

JS通过ajax动态读取xml文件内容的方法

Mar 24 Javascript

jQuery 调用WebService 实例讲解

Jun 28 Javascript

深入理解Angular2 模板语法

Aug 07 Javascript

ionic cordova一次上传多张图片（类似input file提交表单)的实现方法

Dec 16 Javascript

基于JS实现移动端向左滑动出现删除按钮功能

Feb 22 Javascript

微信小程序遇到修改数据后页面不渲染的问题解决

Mar 09 Javascript

浅谈Webpack自动化构建实践指南

Dec 18 Javascript

node实现分片下载的示例代码

Oct 17 Javascript

文本框获得焦点和失去焦点的判断代码

Mar 18 #Javascript

jQuery控制图片的hover效果（smartRollover.js）

Mar 18 #Javascript

基于jQuery的弹出框插件

Mar 18 #Javascript

js性能优化如何更快速加载你的JavaScript页面

Mar 17 #Javascript

Jquery命名冲突解决的五种方案分享

Mar 16 #Javascript

让人期待的2011年度最佳 jQuery 插件分享

Mar 16 #Javascript

JavaScript异步调用定时方法并停止该方法实现代码

Mar 16 #Javascript

You might like

丧钟首部独立剧集《丧钟：骑士与龙》北美正式开播，场面血腥

2020/04/09 欧美动漫

通过对服务器端特性的配置加强php的安全

2006/10/09 PHP

PHP insert语法详解

2008/06/07 PHP

php 静态页面中显示动态内容

2009/08/14 PHP

微信利用PHP创建自定义菜单的方法

2016/08/01 PHP

thinkPHP5 ACL用户权限模块用法详解

2017/05/10 PHP

phpstudy隐藏index.php的方法

2020/09/21 PHP

用正则xmlHttp实现的偷(转)

2007/01/22 Javascript

JavaScript实现打字效果的方法

2015/07/10 Javascript

谈谈对offsetleft兼容性的理解

2015/11/11 Javascript

Bootstrap每天必学之响应式导航、轮播图

2016/04/25 Javascript

AngularJS操作键值对象类似java的hashmap(填坑小结)

2016/11/12 Javascript

最后说说Vue2 SSR 的 Cookies 问题

2018/05/25 Javascript

tracking.js页面人脸识别插件使用方法

2020/04/16 Javascript

VSCode搭建React Native环境

2020/05/07 Javascript

JavaScript Image对象实现原理实例解析

2020/08/26 Javascript

Python调用ctypes使用C函数printf的方法

2017/08/23 Python

基于python的图片修复程序（实现水印去除）

2018/06/04 Python

Python实现钉钉发送报警消息的方法

2019/02/20 Python

django搭建项目配置环境和创建表过程详解

2019/07/22 Python

对Pytorch神经网络初始化kaiming分布详解

2019/08/18 Python

Pytorch 使用不同版本的cuda的方法步骤

2020/04/02 Python

Python Json数据文件操作原理解析

2020/05/09 Python

python打开文件的方式有哪些

2020/06/29 Python

python3实现飞机大战

2020/11/29 Python

美国宠物美容和宠物用品购物网站：Cherrybrook

2018/12/07 全球购物

Big Green Smile法国：领先的英国有机和天然产品在线商店

2021/01/02 全球购物

金额转换，阿拉伯数字的金额转换成中国传统的形式如：（￥1011）－> （一千零一拾一元整）输出

2015/05/29 面试题

大三毕业自我鉴定

2014/01/15 职场文书

环境工程专业自荐信范文

2014/06/24 职场文书

八荣八耻演讲稿

2014/09/15 职场文书

退休党员个人对照检查材料思想汇报

2014/09/29 职场文书

护士求职自荐信范文

2015/03/04 职场文书

2015年乡镇流动人口工作总结

2015/05/12 职场文书

社区服务活动感想

2015/08/11 职场文书

Java Optional<Foo>转换成List<Bar>的实例方法

2021/06/20 Java/Android