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

jQuery 瀑布流浮动布局（一）(延迟AJAX加载图片)

May 23 Javascript

jQuery操作select下拉框的text值和value值的方法

May 31 Javascript

jQuery实现灰蓝风格标准二级下拉菜单效果代码

Aug 31 Javascript

jQuery实现摸拟alert提示框

May 22 Javascript

Bootstrap Metronic完全响应式管理模板之菜单栏学习笔记

Jul 08 Javascript

Angular ng-repeat 对象和数组遍历实例

Sep 14 Javascript

Vue异步组件使用详解

Apr 08 Javascript

React.js绑定this的5种方法(小结)

Jun 05 Javascript

vue.js实现标签页切换效果

Jun 07 Javascript

小程序自定义组件实现城市选择功能

Jul 18 Javascript

pm2发布node配置文件ecosystem.json详解

May 15 Javascript

VUE中的v-if与v-show区别介绍

Mar 13 Vue.js

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 self,$this,const,static,-&gt;的使用

2009/10/22 PHP

windows下升级PHP到5.3.3的过程及注意事项

2010/10/12 PHP

关于file_get_contents返回为空或函数不可用的解决方案

2013/06/24 PHP

php动态绑定变量的用法

2015/06/16 PHP

Laravel5.1 框架Request请求操作常见用法实例分析

2020/01/04 PHP

关于javascript document.createDocumentFragment()

2009/04/04 Javascript

GreyBox技术总结（转）

2010/11/23 Javascript

让浏览器非阻塞加载javascript的几种方法小结

2011/04/25 Javascript

基于JavaScript自定义构造函数的详解说明

2013/04/24 Javascript

jQuery动态改变图片显示大小(修改版)的实现思路及代码

2013/12/24 Javascript

javascript中的Base64、UTF8编码与解码详解

2015/03/18 Javascript

jquery实现带缩略图的全屏图片画廊效果实例

2015/06/25 Javascript

jQuery-1.9.1源码分析系列（十）事件系统之事件体系结构

2015/11/19 Javascript

JS组件Bootstrap Table表格多行拖拽效果实现代码

2015/12/08 Javascript

AngularJS进行性能调优的7个建议

2015/12/28 Javascript

Javascript中的prototype与继承

2017/02/06 Javascript

使用Vue.js和Flask来构建一个单页的App的示例

2018/03/21 Javascript

vue移动端路由切换实例分析

2018/05/14 Javascript

vue文件运行的方法教学

2019/02/12 Javascript

vue使用@scroll监听滚动事件时，@scroll无效问题的解决方法详解

2019/10/15 Javascript

axios封装与传参示例详解

2020/10/18 Javascript

[02:20]DOTA2英雄基础教程黑暗贤者

2013/12/19 DOTA

Python中的sort()方法使用基础教程

2017/01/08 Python

详解Python 装饰器执行顺序迷思

2018/08/08 Python

python得到qq句柄,并显示在前台的方法

2018/10/14 Python

Python 正则表达式匹配字符串中的http链接方法

2018/12/25 Python

Django框架查询Extra功能实现解析

2019/09/04 Python

selenium学习教程之定位以及切换frame（iframe）

2021/01/04 Python

英国家庭珠宝商：T. H. Baker

2018/02/08 全球购物

蔻驰西班牙官网：COACH西班牙

2019/01/16 全球购物

MaBelle玛贝尔香港官网：香港钻饰连锁店

2019/09/09 全球购物

函授本科毕业生自我鉴定

2013/10/16 职场文书

销售简历自我评价

2014/01/24 职场文书

元旦晚会策划方案

2014/02/18 职场文书

企业承诺书格式范文

2015/04/28 职场文书

新娘婚礼答谢词

2015/09/29 职场文书