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

论坛特效代码收集（落伍转发-不错）

Dec 02 Javascript

jQuery ui 1.7更新小结

Aug 15 Javascript

URL地址中的#符号使用说明

Feb 12 Javascript

JavaScript ECMA-262-3 深入解析.第三章.this

Sep 28 Javascript

jQuery图片特效插件Revealing实现拉伸放大

Apr 22 Javascript

浅谈JavaScript 函数参数传递到底是值传递还是引用传递

Aug 23 Javascript

JS实现给对象动态添加属性的方法

Jan 05 Javascript

Vue.js在使用中的一些注意知识点

Apr 29 Javascript

在js代码拼接dom对象到页面上的模板总结

Oct 21 Javascript

JavaScript 复制对象与Object.assign方法无法实现深复制

Nov 02 Javascript

js对象属性名驼峰式转下划线的实例代码

Sep 17 Javascript

基于angular实现树形二级表格

Oct 16 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自动生成月历代码

2006/10/09 PHP

php iconv() : Detected an illegal character in input string

2010/12/05 PHP

PHP的fsockopen、pfsockopen函数被主机商禁用的解决办法

2014/07/08 PHP

Laravel与CI框架中截取字符串函数

2016/05/08 PHP

php安装php_rar扩展实现rar文件读取和解压的方法

2016/11/17 PHP

用javascript实现改变TEXTAREA滚动条和按钮的颜色，以及怎样让滚动条变得扁平

2007/04/20 Javascript

Prototype String对象学习

2009/07/19 Javascript

javascript 显示当前系统时间代码

2009/12/28 Javascript

javascript 中String.match()与RegExp.exec()的区别说明

2013/01/10 Javascript

jquery中使用$(#form).submit()重写提交表单无效原因分析及解决

2013/03/25 Javascript

jQuery代码实现图片墙自动+手动淡入淡出切换效果

2016/05/09 Javascript

9个让JavaScript调试更简单的Console命令

2016/11/14 Javascript

vue2中使用less简易教程

2018/03/27 Javascript

详解在React.js中使用PureComponent的重要性和使用方式

2018/07/10 Javascript

详解easyui基于 layui.laydate日期扩展组件

2018/07/18 Javascript

VsCode里的Vue模板的实现

2020/08/12 Javascript

Python random模块常用方法

2014/11/03 Python

分析在Python中何种情况下需要使用断言

2015/04/01 Python

python模块之sys模块和序列化模块(实例讲解)

2017/09/13 Python

Python Flask-web表单使用详解

2017/11/18 Python

浅谈python中requests模块导入的问题

2018/05/18 Python

终端命令查看TensorFlow版本号及路径的方法

2018/06/13 Python

对python中array.sum(axis=?)的用法介绍

2018/06/28 Python

使用Python制作简单的小程序IP查看器功能

2019/04/16 Python

tensorflow的ckpt及pb模型持久化方式及转化详解

2020/02/12 Python

Python性能分析工具py-spy原理用法解析

2020/07/27 Python

Python如何将模块打包并发布

2020/08/30 Python

Eastbay官网：美国最大的运动鞋网络零售商

2016/07/27 全球购物

韩国邮政旗下生鲜食品网上超市：epost

2016/08/27 全球购物

酒店保安领班职务说明书

2014/03/04 职场文书

片区教研活动总结

2014/07/02 职场文书

八荣八耻的活动方案

2014/08/16 职场文书

企业财务人员岗位职责

2015/04/14 职场文书

纪检监察立案决定书

2015/06/24 职场文书

陶瓷类经典广告语集锦

2019/10/25 职场文书

大型强子对撞机再次重启探索“第五种自然力”

2022/04/29 数码科技