jq-toggle
jq-toggle:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>toggle<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>toggle</title>
<style>
* {
margin: 0;
padding: 0;
}
button {
font-size: 18px;
padding: 0 19px;
}
#con {
width: 500px;
background: #ccc;
color: red;
font-size: 18px;
overflow: hidden;
}
</style>
<script src="js/jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button id="zk">展开</button>
<button id="sq">收起</button>
<div id="con">
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
展开收起动画效果
</div>
<script type="text/javascript">
$('#sq').click(function() {
// $('#con').toggle();
$('#con').toggle(3000);
});
</script>
</body>
</html>
</title>
</head>
<body>
</body>
</html>
jq-toggle的更多相关文章
- 关于JQ toggle 的注意事项
1.9.1以后的版本,好像不支持 jq 的 toggle function的用法啦.
- Jquery 使用小结
JQuery API中文档地址:http://www.hemin.cn/jq/index.html JQuery 中文社区:http://www.jquery.org.cn/ 1.siblings() ...
- Java Web-JQuery学习
Java Web-JQuery学习 JQuery概念 是一个JS框架,可以用来简化JS的开发,设计宗旨是"write less,do more",即写更少的代码,做更多的事情.它封 ...
- java:JQuery(声明,JQ和JS对象的区别,prop,attr,addClass,offset,trigger,dblclick和change事件,hide,show,toggle,slideUp,slideDown,slideToggle,三种选择器,标签的获取,三张图片的放大与缩小)
1.JQuery: jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计 的宗旨是“ ...
- 【JQ】toggle / slideToggle / fadeToggle 的区别
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQ的toggle()方法示例
定义和用法toggle() 方法切换元素的可见状态.如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素. 语法$(selector).toggle(speed,callback,swi ...
- jq 切换功能toggle
---恢复内容开始--- $(document).ready(function () { $(".jianjie").click(function () { $(this).tog ...
- JQ 使用toggle实现DIV的隐藏和显示
$('.submenuA').toggle( function () { $(this).next('div').show(); }, function () { $(this).next('div' ...
- jQ的toggle() 方法
语法:$(selector).toggle(speed,callback,switch) 实例: <script src="js/jquery.min.js">< ...
- jquery的show/hide/toggle详解
通过阅读源码我们发现show,hide,toggle调用了showHide和isHidden这2个方法,所以我们要搞明白原理必须先看一下这2个方法. jQuery.fn.extend({ ...... ...
随机推荐
- hive、impala集成ldap
1.概要 1.1 环境信息 hadoop:cdh5.10 os:centos6.7 user:root hive.impala已集成sentry 1.2 访问控制权限 这里通过使用openldap来控 ...
- DDD领域驱动 (一)
说道DDD不得不说传统的架构与DDD的架构区别. 传统的架构不外乎就是三层,而在这三层里面又不断的细分,始终没有达到想要的效果,那么为什么当时还是采用三层. 当然在DDD没有提出的时候三层是大多数人的 ...
- New Adventure----GUI Design Studio
新建项目工程 File->New Project 新建设计文件 Project->New Design 单个设计文件的页面,F9运当前设计页面 页面控件中有绿色包围的控件为 ...
- One day one cf,Keep Wa away from me.
Codeforces Round #379 (Div. 2) A水,算字符个数 B水,贪心优先组成后者 C贪心尺取,以消耗排序change那个,然后贪心另一个 D对角线就是x0+y0 == x1+y1 ...
- 10.Java 加解密技术系列之 DH
Java 加解密技术系列之 DH 序 概念 原理 代码实现 结果 结束语 序 上一篇文章中简单的介绍了一种非对称加密算法 — — RSA,今天这篇文章,继续介绍另一种非对称加密算法 — — DH.当然 ...
- Pandas日期数据处理:如何按日期筛选、显示及统计数据
前言 pandas有着强大的日期数据处理功能,本期我们来了解下pandas处理日期数据的一些基本功能,主要包括以下三个方面: 按日期筛选数据 按日期显示数据 按日期统计数据 运行环境为 windows ...
- Linux与mv命令结合,移动文件至指定目录
转自:http://blog.csdn.net/hardwin/article/details/7711635 把当前目录下面的file(不包括目录),移动到/opt/shell find . - ...
- [原创]CentOS实现智能DNS
一. 环境: Centos-6.6-x64位操作系统,IP地址:210.38.248.7 二. 安装和配置bind服务: 1. 命令:yum install bind ...
- sh脚本异常,binsh^M bad interpreter No such file or directory
错误 在Linux中执行.sh脚本,出现如下异常 /bin/sh^M: bad interpreter: No such file or directory 原因 在windows系统中编辑的.sh文 ...
- 弹出框插件layer使用
layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 插件官方地址:http://layer.layui.co ...