toggleClass slideToggle
$("#wrapper").toggleClass("toggled");
$("p").slideToggle(1000);
demo:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="./jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".mybutton").click(function(){
$(".notice").slideToggle("slow");
});
});
</script>
<style type="text/css">
div.notice
{
height:320px;
background:#e5eecc;
padding-left: 250px;
display:none;
}
</style>
</head>
<body>
<p>
<div class="notice">
<h1>wellcome</h1>
<p>how to show slideToggle</p>
<p>canyoushowit</p>
</div>
<button class="mybutton"> click me</button>
</body>
</html>
toggleClass slideToggle的更多相关文章
- jQuery基础 浅析（含基本方法和选择器）
1.jQuery与DOM互相转换 jQuery入库函数:$(document).ready(function(){}) $(function(){}) $(“#btn”):jQuery存储的是DOM对 ...
- 原生JavaScript实现hasClass、addClass、removeClass、toggleClass
兼容IE6+,因IE6.IE7.IE8不支持Array.prototype.indexOf()和String.prototype.trim(),分别用Polyfill实现支持. 详细: indexOf ...
- angularjs与jquery特效slidetoggle结合
之前使用jquery的slidetoggle方法,可以轻易的实现元素的收缩展开:使用angularjs后,没有找到相关的方法,通过多方面查资料,自己写了个demo,展示slidetoggle的angu ...
- jQuery知识点一 each()和toggleClass()
jQuery的一些东东比较容易忘,所以在这里整理一下... ... 1. each (1) $(selector).each(function(index,element)) inde ...
- jquery之toggleClass应用
今天记载一下常用的html + css + jquery效果应用 1.html内容 <div class="selBtn screen_btn"> <a id=& ...
- js实现css、addClass、removeClass和toggleClass
JQuery中获取CSS样式css(name):访问第一匹配元素的样式属性css(name,value):在所有匹配的元素中,设置一个样式属性的值css(properties):把一个“名/值对”对象 ...
- addClass, removeClass, toggleClass（从jquery中抠出来）
<div id="d3" class="cur"></div> var mylibs = (function(){ var rtrim ...
- addClass() 和 toggleClass()
addClass()是在原有的类基础上增加类属性,仍然保留原有的类的样式.语法格式为:addClass(class0 class1 ...) ,例如: $("p").addClas ...
- jquery实现页面动态切换的方法--toggleClass(className)
$(function() { $(".A").click(function() { $(this).toggleClass("B"); }); }); 当点击带 ...
随机推荐
- vue路由知识整理
vue路由知识整理 对于单页应用,官方提供了vue-router进行路由跳转的处理.我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件(compo ...
- UVA 11248 Frequency Hopping
Frequency Hopping Time Limit: 10000ms Memory Limit: 131072KB This problem will be judged on UVA. Ori ...
- 在Windows Server 2008 R2中删除网桥
How to remove a network bridge in Windows Server 2008 R2 症状: 删除网桥的时候,按理说应该在“网络连接”中选择要被删除的网桥,右键点击,然后选 ...
- Ubuntu搜狗输入法的安装
Ubuntu搜狗输入法的安装 这个直接安装就可以了:因为现在的Ubuntu是16.04版本,输入法已经是Fcitx版本: 下载搜狗输入法For Linux之后,直接双击就可以安装了: 安装之后,需要注 ...
- NPOI操作Excel 004：写入空Excel(添加保存提示框)
前文说道写入excel的样例,当中保存Excle后须要添加提示框.让用户自己选择保存路径,做改动例如以下. 引用的dll等前面已经说过了, 直接看代码: protected void Btn_Writ ...
- Linux系统编程——进程间通信：管道（pipe）
管道的概述 管道也叫无名管道,它是是 UNIX 系统 IPC(进程间通信) 的最古老形式,全部的 UNIX 系统都支持这样的通信机制. 无名管道有例如以下特点: 1.半双工,数据在同一时刻仅仅能在一个 ...
- node04---fs文件操作、静态服务器
08fs.js var http = require("http"); var fs = require("fs"); var server = http.cr ...
- WebAPI返回数据类型解惑 以及怎样解决Extjs无法解析返回的xml
最近开始使用WebAPI,上手很容易,然后有些疑惑 1.WebAPI默认返回什么数据类型,json还是xml? 2.怎么修改WebAPI的返回数据类型,我用IE浏览器请 求返回的数据都是JSON格式的 ...
- 关于nth-of-type和nth-child的关系
一开始写样式的时候喜欢全部元素都来个class,后面发现这样一个页面下来很多个class,起名字起到发慌,然后老师说该多用 逻辑关系来写样式,就是这种第几个孩子啊这种,不知道你们有没有这种烦恼,要用的 ...
- Angular2/Ionic2集成Promact/md2.md
最近想找一套比较完整的基于Material风格的Angular2的控件库,有两个选择一个是Angular官方的Material2,但是这套库的DatePicker控件目前只能支持年月日,不支持时分秒, ...