编程 Javascript

jQuery使用slideUp方法实现控制元素缓慢收起

Posted in Javascript onMarch 27, 2015

本文实例讲述了jQuery使用slideUp方法实现控制元素缓慢收起功能的技巧。分享给大家供大家参考。具体实现方法如下：

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
 $("#flip").click(function(){
  $("#panel").slideUp("slow");
 });
});
</script>
<style type="text/css">
#panel,#flip
{
padding:5px;
text-align:center;
background-color:#e5eecc;
border:solid 1px #c3c3c3;
}
#panel
{
padding:50px;
}
</style>
</head>
<body>
<div id="flip">Click to slide up panel</div>
<div id="panel">Hello world!</div>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

- Author -

上大王

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

Javascript 相关文章推荐

javascript中substr,substring,slice.splice的区别说明

Nov 25 Javascript

11款新鲜的jQuery插件[附所有demo下载]

Jan 24 Javascript

jquery五角星评分插件示例分享

Feb 21 Javascript

js实现缓冲运动效果的方法

Apr 10 Javascript

JavaScript学习笔记之取数组中最大值和最小值

Mar 23 Javascript

Web Uploader文件上传插件使用详解

May 10 Javascript

jQuery获取table行数并输出单元格内容的实现方法

Jun 30 Javascript

vue.js利用defineProperty实现数据的双向绑定

Apr 28 Javascript

新手vue构建单页面应用实例代码

Sep 18 Javascript

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

Dec 18 Javascript

微信小程序支付PHP代码

Aug 23 Javascript

vue element upload组件 file-list的动态绑定实现

Oct 11 Javascript

jquery使用animate方法实现控制元素移动

Mar 27 #Javascript

jQuery获取标签文本内容和html内容的方法

Mar 27 #Javascript

Node.js 去掉种子(torrent)文件里的邪恶信息

Mar 27 #Javascript

jQuery使用attr()方法同时设置多个属性值用法实例

Mar 26 #Javascript

jQuery使用prepend()方法在元素前添加内容用法实例

Mar 26 #Javascript

jQuery使用append在html元素后同时添加多项内容的方法

Mar 26 #Javascript

jQuery使用before()和after()在元素前后添加内容的方法

Mar 26 #Javascript

You might like

php中的登陆login

2007/01/18 PHP

PHP mysql事务问题实例分析

2016/01/18 PHP

在Laravel框架里实现发送邮件实例(邮箱验证)

2016/05/20 PHP

PHP Filter过滤器全面解析

2016/08/09 PHP

利用javascript移动div层-javascript 拖动层

2009/03/22 Javascript

Jquey拖拽控件Draggable使用方法(asp.net环境)

2010/09/28 Javascript

理解javascript回调函数

2014/12/28 Javascript

jQuery链式操作实例分析

2015/11/16 Javascript

动态加载js、css的实例代码

2016/05/26 Javascript

JS作用域链详解

2017/06/26 Javascript

AngularJS集合数据遍历显示的实例

2017/12/27 Javascript

微信小程序中使用wxss加载图片并实现动画效果

2018/08/13 Javascript

详解Angular Forms中自定义ngModel绑定值的方式

2018/12/10 Javascript

highcharts.js数据绑定方式代码实例

2019/11/13 Javascript

vue仿淘宝滑动验证码功能(样式模仿)

2019/12/10 Javascript

JavaScript交换变量的常用方法小结【4种方法】

2020/05/07 Javascript

[01:11:10]2014 DOTA2华西杯精英邀请赛 5 24 iG VS VG加赛

2014/05/26 DOTA

[43:24]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第二场 12.12

2020/12/17 DOTA

python 获取et和excel的版本号

2009/04/09 Python

python使用ctypes模块调用windowsapi获取系统版本示例

2014/04/17 Python

Python脚本判断 Linux 是否运行在虚拟机上

2015/04/25 Python

python3使用PyMysql连接mysql数据库实例

2017/02/07 Python

Python3之读取连接过的网络并定位的方法

2018/04/22 Python

Python使用matplotlib模块绘制图像并设置标题与坐标轴等信息示例

2018/05/04 Python

Python matplotlib的使用并自定义colormap的方法

2018/12/13 Python

Numpy对数组的操作：创建、变形(升降维等)、计算、取值、复制、分割、合并

2019/08/28 Python

Python+OpenCV实现旋转文本校正方式

2020/01/09 Python

浅谈numpy中np.array()与np.asarray的区别以及.tolist

2020/06/03 Python

对Keras中predict()方法和predict_classes()方法的区别说明

2020/06/09 Python

Python趣味实例，实现一个简单的抽奖刮刮卡

2020/07/18 Python

python批量修改文件名的示例

2020/09/27 Python

详解快速开发基于 HTML5 网络拓扑图应用

2018/01/08 HTML / CSS

初三开学计划书

2014/04/27 职场文书

做一个有道德的人活动方案

2014/08/25 职场文书

2015年基建工作总结范文

2015/05/23 职场文书

迎客户欢迎词三篇

2019/09/27 职场文书