编程 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 相关文章推荐

Javascript 各浏览器的 Javascript 效率对比

Jan 23 Javascript

JQuery UI DatePicker中z-index默认为1的解决办法

Sep 28 Javascript

再探JavaScript作用域

Sep 24 Javascript

jquery转盘抽奖功能实现

Nov 13 Javascript

JavaScript 七大技巧（一）

Dec 13 Javascript

基于node实现websocket协议

Apr 25 Javascript

js实现登录与注册界面

Nov 01 Javascript

vue之浏览器存储方法封装实例

Mar 15 Javascript

vue-router路由懒加载的实现（解决vue项目首次加载慢）

Aug 28 Javascript

jQuery中实现text()的方法

Apr 04 jQuery

vue2.0 实现富文本编辑器功能

May 26 Javascript

使用webpack/gulp构建TypeScript项目的方法示例

Dec 18 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

php小技巧把数组的键和值交换形成了新的数组,查找值取得键

2011/06/02 PHP

php定时删除文件夹下文件(清理缓存文件)

2013/01/23 PHP

php以post形式发送xml的方法

2014/11/04 PHP

js判断ie版本号的简单实现代码

2014/03/05 Javascript

javascript获得当前的信息的一些常用命令

2015/02/25 Javascript

Jquery使用css方法改变样式实例

2015/05/18 Javascript

在for循环中length值是否需要缓存

2015/07/27 Javascript

jquery ztree异步搜索（搜叶子）实践

2016/02/25 Javascript

JS小数运算出现多为小数问题的解决方法

2016/06/02 Javascript

jQuery简单设置文本框回车事件的方法

2016/08/01 Javascript

vue2.0嵌套路由实现豆瓣电影分页功能(附demo)

2017/03/13 Javascript

实时监控input框,实现输入框与下拉框联动的实例

2018/01/23 Javascript

动态加载JavaScript文件的3种方式

2018/05/05 Javascript

深入浅析AngularJs模版与v-bind

2018/07/06 Javascript

浅析JS中NEW的实现原理及重写

2020/02/20 Javascript

为什么JavaScript中0.1 + 0.2 != 0.3

2020/12/03 Javascript

[02:02]DOTA2英雄基础教程斯拉达

2013/12/11 DOTA

在Python中操作字符串之startswith()方法的使用

2015/05/20 Python

在SAE上部署Python的Django框架的一些问题汇总

2015/05/30 Python

python实现xlsx文件分析详解

2018/01/02 Python

使用Python OpenCV为CNN增加图像样本的实现

2019/06/10 Python

python读取并写入mat文件的方法

2019/07/12 Python

python DataFrame转dict字典过程详解

2019/12/26 Python

Django之富文本(获取内容,设置内容方式)

2020/05/21 Python

详解python使用金山词霸的翻译功能(调试工具断点的使用)

2021/01/07 Python

Python 图片处理库exifread详解

2021/02/25 Python

香港连卡佛百货官网：Lane Crawford

2019/09/04 全球购物

质量工程师岗位职责

2013/11/16 职场文书

小区停车场管理制度

2014/01/27 职场文书

2015年元旦文艺汇演主持词

2014/03/26 职场文书

党员干部公开承诺书

2014/03/26 职场文书

2014年发展党员工作总结

2014/11/12 职场文书

上课睡觉万能检讨书

2015/02/17 职场文书

仙境之桥观后感

2015/06/16 职场文书

2016年过年放假安排通知

2015/08/18 职场文书

分享15个Webpack实用的插件！！！

2021/03/31 Javascript