Jquery——hover与toggle
hover方法的语法结构为:hover(enter,leave) hover()当鼠标移动到元素上时,会触发第一个方法,当鼠标移开的时候会触发第二个方法 复制代码
<html>
<head>
<title>测试用</title>
<script type="text/javascript" src="../jquery-1.3.2.min.js"></script>
<script type="text/javascript">
window.onload=init;
function init(){
$("#panel h5.head").hover(function(){
$(this).next().hide();
},function(){
$(this).next("div .content").show();
});
}
</script> </head>
<body>
<div id="panel">
<h5 class="head">什么事jquery</h5>
<div class="content">
混蛋
</div>
</div> </body>
</html> 复制代码 toggle(fn1,fn2,fn3..)这个方法是每次单击调用下一个方法,如果方法是最后一个,那么从第一个开始 如果只有2个方法,则是互相切换效果。 复制代码
<html>
<head>
<title>测试用</title>
<script type="text/javascript" src="../jquery-1.3.2.min.js"></script>
<script type="text/javascript">
window.onload=init;
function init(){
$("#panel h5.head").toggle(function(){
$(this).addClass("highlight");
$(this).next().hide();
},function(){
$(this).removeClass("highlight");
$(this).next("div .content").show();
}); }
</script>
<style type="text/css">
.highlight{
background:#ff3300;
}
</style>
</head>
<body>
<div id="panel">
<h5 class="head">什么事jquery</h5>
<div class="content">
混蛋
</div>
</div> </body>
</html>
Jquery——hover与toggle的更多相关文章
- JQuery hover toggle事件使用
JQuery hover toggle事件使用: <%@ page language="java" import="java.util.*" pageEn ...
- jquery点击改变class并toggle;jquery点击改变图片src源码并toggle;jquery显示隐藏toggle
<html><head><meta charset="utf-8"><title></title><script ...
- jQuery hover demo
先放效果图: 百度云下载地址:http://pan.baidu.com/s/1dDpn1Sl 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...
- JQuery hover(over,out) 使用笔记
转载自:http://www.douban.com/note/202404884/ JQuery hover(over,out) 使用笔记 JavaScript 下.onmouseover() 和 o ...
- 基于jquery hover图片遮罩层滑动
分享一款基于jquery hover图片遮罩层滑动.这是一款仿腾讯课堂的鼠标悬停经过图片遮罩透明层滑动效果.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div clas ...
- css hover伪类选择器与JQuery hover()方法
css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...
- Jquery中的toggle()方法
Jquery中的toggle()方法,有一次在看别人写的Jquery插件时,发现对toggle有如下使用 search.pagePrevious.toggle(data.pageNumber > ...
- jquery hover最后解决 - 不再疑惑 - 例子在这里
hover具有动画累计的bug, 可以使用 stop 或 filter(:not(:animated))来消除, 但是, 即使这样, 当鼠标反复滑入或滑出的时候, 虽然没有动画累计的问题, 但是 下面 ...
- jQuery hover事件
hover(over,out)一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种"保持在其中"的状态. 当鼠标移动到 ...
随机推荐
- [Win32]获取指定进程的父进程PID
// // #include <Windows.h> #include <winnt.h> #include <winternl.h> typedef NTSTAT ...
- 初识安卓小程序(Android电话拨号器)
首先,先创建一个安卓项目(我的版本号是4.4.2的),名字为"电话拨号器",创建的时候点击"clipart",如图: 然后在res目录下找到layout目录,找 ...
- git服务器的建立——Git折腾小记
转自:http://blog.csdn.net/xsl1990/article/details/25486211 如果你能看到一些sshd相关的进程信息,则说明你已经有这个服务了,否则(或者你想更新的 ...
- VS2010Web默认的浏览器设置和VS里调试JavaScript代码的设置
前言 重装系统后,VS调用的Web浏览器不是IE了,VS调式不了JavaScript代码了.这两天一直在试终于搞定了.这里查找的问题当然主要是VS里面调式JavaScript代码了. 第一种方式设置V ...
- 应用内截屏的代码,在Activity中测试可用
截屏功能让我十分头疼,想做个无需root的又找不到资料.这里暂且分享一个无需root的,在应用内截屏的代码,本文转自:http://blog.csdn.net/csh159/article/detai ...
- cat、tac、rev、nl命令
当日志文件log.log很长,但又要按内容从后往前查看时,可以使用如下命令: tac log.log | more cat 由第一行开始显示内容,并将所有内容输出 tac 从最后 ...
- MySQL中的information_schema数据库表说明
MySQL 中的 information_schema 数据库 版权声明:https://blog.csdn.net/kikajack/article/details/80065753 1. 概述 ...
- 在ubuntu中搜索文件或文件夹的方法
版权声明:本文为博主原创文章,转载请注明出处. https://blog.csdn.net/dcrmg/article/details/78000961 1. whereis+文件名 用于程序名的搜索 ...
- Table does not have the identity property. Cannot perform SET operation.
Table does not have the identity property. Cannot perform SET operation. 解决: set IDENTITY_INSERT ...
- iOS开发-UITapGestureRecognizer手势
手势在iOS开发中是一个比较常用的功能,不过相对来说大家用的比较少,经常刷网易新闻,上次用了一下捏合手势才发现可以调整字体大小.昨天看到一个介绍摇一摇这个功能的,没看到之前一直都觉得摇一摇是微信的专有 ...