jQuery——切换toggle
toggle()-----显示隐藏
toggleClass-------添加类或者删除类
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-1.11.1.js"></script>
<style>
div {
width: 100px;
height: 100px;
border: 1px solid #ccc;
} .box1 {
margin-right: 10px;
} .show {
background-color: red;
}
</style> <script src="jquery-1.11.1.js"></script>
<script>
$(function () {
$("button").click(function () {
$(".box1").toggleClass("show");
});
});
</script>
</head>
<body>
<button>切换</button>
<div class="box1"></div>
</body>
</html>
jQuery——切换toggle的更多相关文章
- 手动实现jQuery的toggle()效果
有时候我们希望实现toggle()切换效果,但是切换的同时需要完成一些其他要做的事情.所以我们需要对jQuery的toggle()函数进行改造. 下面好test2()函数就是一个实现toggle效果的 ...
- jQuery的toggle()的自动触发真烦人
jQuery的toggle()方法应该是在鼠标点击后才会触发,现在的问题是在ready加载后就自动触发了,怎么回事呢? 答案是jQuery的版本问题,在1.9以后的版本toggle()就存在这个问题, ...
- 关于jQuery中toggle()函数的使用
今天遇到一个有趣的例子,将它记录下来. 一个一级菜单,里边有一个二级菜单,二级菜单是通过锚点来链接页面元素的.想要实现的效果是当点击锚点时,页面链接到相应锚点,同时二级菜单隐藏,再点击一级菜单时,继续 ...
- JQuery hover toggle事件使用
JQuery hover toggle事件使用: <%@ page language="java" import="java.util.*" pageEn ...
- jQuery基本toggle() toggleClass() 使用
今天来学习一下jQuery的基本函数的使用,很简单. 首先写一个button做控制按钮,然后写一个div用按钮控制idv做动画,从而测试JQuery的动画函数 <head> <met ...
- jQuery UI 实例 – 切换(Toggle)
toggle()函数用于为每个匹配元素的click事件绑定轮流的处理函数. toggle()是一个特殊的事件函数,用于为匹配元素的click事件绑定多个事件处理函数.每次触发click事件时,togg ...
- jQuery 效果 - toggle() 方法切换元素的可见状态。
定义和用法 toggle() 方法切换元素的可见状态. 如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素. 语法 $(selector).toggle(speed,callback, ...
- Jquery中toggle的用法详情
jquery ----toggle([speed],[easing],[fn]) 用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的click事件 如果元素是可见的,切换为隐藏的:如果元素是隐藏 ...
- jQuery切换事件
有html页面内容如下: <body> <h5 id="hh">关于jQuery的介绍</h5> <p id="p1" ...
随机推荐
- java多线程编程核心技术（三）--线程间通信
1.等待/通知机制 1.wait()方法:使当前执行代码的线程进行等待.wait()方法是Object类的方法,该方法将当前线程放入“预执行队列”中,并在wait()所处的代码行处停止执行.只到被唤起 ...
- CODEVS——T 1700 施工方案第二季
http://codevs.cn/problem/1700/ 2012年市队选拔赛北京 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 ...
- cogs——908. 校园网
908. 校园网 ★★ 输入文件:schlnet.in 输出文件:schlnet.out 简单对比 时间限制:1 s 内存限制:128 MB USACO/schlnet(译 by Fe ...
- FreeMarker与Spring MVC 4结合错误：Caused by: java.lang.NoClassDefFoundError: org/springframework/ui/freemarker/FreeMarkerConfiguration
添加spring-context-support的依赖到POM: <!-- spring-context-support --> <!-- https://mvnrepository ...
- 23、Java并发性和多线程-重入锁死
以下内容转自http://ifeve.com/reentrance-lockout/: 重入锁死与死锁和嵌套管程锁死非常相似.锁和读写锁两篇文章中都有涉及到重入锁死的问题. 当一个线程重新获取锁,读写 ...
- Windows下Redis的安装与部署
1.下载地址:https://github.com/MSOpenTech/redis/releases 2.下载zip的包,下载后放到需要安装的目录进行解压操作,列如:F:\Redis\Redis-x ...
- access-list/eigrp等 反掩码计算
access-list/eigrp等 反掩码计算 原则:地址部分,相同的照写,不同的写"0" 反掩码部分,相同的写"0",不同的写"1&quo ...
- LeetCode 83. Remove Duplicates from Sorted List （从有序链表中去除重复项）
Given a sorted linked list, delete all duplicates such that each element appear only once. For examp ...
- BestCoder Round #59 (div.2) B. Reorder the Books 想法题
Reorder the Books 问题描述 dxy家收藏了一套书,这套书叫<SDOI故事集>,<SDOI故事集>有n(n\leq 19)n(n≤19)本,每本书有一个编号,从 ...
- apache ua Custom Log Formats
RewriteEngine OnRewriteBase / RewriteCond %{HTTP_USER_AGENT} (android|bb\d+|meego).+mobile|avantgo|b ...