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

jquery 简单图片导航插件jquery.imgNav.js

Mar 17 Javascript

aspx中利用js实现确认删除代码

Jul 22 Javascript

jquery插件之easing使用

Aug 19 Javascript

JavaScript 继承使用分析

May 12 Javascript

jquery特效点击展示与隐藏全文

Dec 09 Javascript

Javascript highcharts 饼图显示数量和百分比实例代码

Dec 06 Javascript

jQuery实现的省市联动菜单功能示例【测试可用】

Jan 13 Javascript

javascript表达式和运算符详解

Feb 07 Javascript

三分钟学会用ES7中的Async/Await进行异步编程

Jun 14 Javascript

微信小程序form表单组件示例代码

Jul 15 Javascript

关于vue表单提交防双/多击的例子

Oct 31 Javascript

JavaScript实现点击图片换背景

Nov 20 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

一个用于MySQL的PHP XML类

2006/10/09 PHP

初探PHP5

2006/10/09 PHP

PHP 危险函数解释分析

2009/04/22 PHP

浅析php-fpm静态和动态执行方式的比较

2016/11/09 PHP

PHP简单验证码功能机制实例详解

2019/03/27 PHP

jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)

2010/04/01 Javascript

写js时遇到的一些小问题

2010/12/06 Javascript

基于jQuery实现表格数据的动态添加与统计的代码

2011/01/31 Javascript

使用ImageMagick进行图片缩放、合成与裁剪(js+python)

2013/09/16 Javascript

javascript创建含数字字母的随机字符串方法总结

2016/08/01 Javascript

Angular 常用指令实例总结整理

2016/12/13 Javascript

如何用JS/HTML将时间戳转换为“xx天前”的形式

2017/02/06 Javascript

完美解决jQuery的hover事件在IE中不停闪动的问题

2017/02/10 Javascript

Bootstrap DateTime Picker日历控件简单应用

2017/03/25 Javascript

react-redux中connect()方法详细解析

2017/05/27 Javascript

Vue组件的使用及个人理解与介绍

2019/02/09 Javascript

浅谈layui 表单元素的选中问题

2019/10/25 Javascript

layui实现给某一列加点击事件

2019/10/26 Javascript

Vue的双向数据绑定实现原理解析

2020/02/17 Javascript

小程序使用分包的示例代码

2020/03/23 Javascript

[58:42]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第一局

2016/02/27 DOTA

[19:26]TNC vs EG (BO3)

2018/06/07 DOTA

python操作MySQL数据库具体方法

2013/10/28 Python

Python绘制正余弦函数图像的方法

2018/08/28 Python

使用 Python ssh 远程登陆服务器的最佳方案

2020/03/06 Python

python实现一次性封装多条sql语句(begin end)

2020/06/06 Python

Python常用数字处理基本操作汇总

2020/09/10 Python

详解CSS的border边框属性及其在CSS3中的新特性

2016/05/10 HTML / CSS

英国领先的高街书籍专家：Waterstones

2018/02/01 全球购物

时尚圣经：The Fashion Bible

2019/03/03 全球购物

简历的自我评价

2014/02/03 职场文书

个人买房协议书范本

2014/10/06 职场文书

读后感作文评语

2014/12/25 职场文书

公司股份转让协议书范本

2015/01/28 职场文书

大学生敬老院活动总结

2015/05/07 职场文书

公司车辆管理制度

2015/08/04 职场文书