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的更多相关文章

  1. JQuery hover toggle事件使用

    JQuery hover toggle事件使用: <%@ page language="java" import="java.util.*" pageEn ...

  2. jquery点击改变class并toggle；jquery点击改变图片src源码并toggle；jquery显示隐藏toggle

    <html><head><meta charset="utf-8"><title></title><script ...

  3. jQuery hover demo

    先放效果图: 百度云下载地址:http://pan.baidu.com/s/1dDpn1Sl 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...

  4. JQuery hover(over,out) 使用笔记

    转载自:http://www.douban.com/note/202404884/ JQuery hover(over,out) 使用笔记 JavaScript 下.onmouseover() 和 o ...

  5. 基于jquery hover图片遮罩层滑动

    分享一款基于jquery hover图片遮罩层滑动.这是一款仿腾讯课堂的鼠标悬停经过图片遮罩透明层滑动效果.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div clas ...

  6. css hover伪类选择器与JQuery hover()方法

    css hover伪类选择器 它属于anchor伪类 在支持 CSS 的浏览器中,<a>标签链接的不同状态都可以以不同的方式显示,常常用来改链接的颜色效果 实例 a:link {color ...

  7. Jquery中的toggle()方法

    Jquery中的toggle()方法,有一次在看别人写的Jquery插件时,发现对toggle有如下使用 search.pagePrevious.toggle(data.pageNumber > ...

  8. jquery hover最后解决 - 不再疑惑 - 例子在这里

    hover具有动画累计的bug, 可以使用 stop 或 filter(:not(:animated))来消除, 但是, 即使这样, 当鼠标反复滑入或滑出的时候, 虽然没有动画累计的问题, 但是 下面 ...

  9. jQuery hover事件

    hover(over,out)一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种"保持在其中"的状态. 当鼠标移动到 ...

随机推荐

  1. Git 的 WindowsXP安装

    文章1: http://blog.sina.com.cn/s/blog_5063e4c80100sqzq.html 一.安装必要客户端 1. TortoiseGit http://tortoisegi ...

  2. ASP.NET Web API实践系列07,获取数据, 使用Ninject实现依赖倒置,使用Knockout实现页面元素和视图模型的双向绑定

    本篇接着上一篇"ASP.NET Web API实践系列06, 在ASP.NET MVC 4 基础上增加使用ASP.NET WEB API",尝试获取数据. 在Models文件夹下创 ...

  3. 查看webservice服务下的所有方法和参数类型

    方法:直接在IE浏览器中输入webservice的地址,查看返回的XML数据即可. 效果如下:

  4. java对象的六大原则

    对象的六大原则: 1.单一职责原则(Single Responsibility Principle  SRP) 2.开闭原则(Open Close Principle OCP) 3.里氏替换原则(Li ...

  5. java单例模式实例

    什么是单例模式? 定义:确保一个类只有一个实例,而且自行实例化并向整个系统提供这个实例场景,也就是说:确保某个类有且只有一个对象的场景,避免产生多个对象消耗过多的资源,或者某种类型的对象应该有且只有一 ...

  6. 【转】memcached分布式部署

    FROM : http://www.tuicool.com/articles/777nE3j memcache和memcached两者使用起来几乎一模一样. $mem = new Memcache; ...

  7. [转]MCC(移动国家码)和 MNC(移动网络码)

    From : http://blog.chinaunix.net/uid-20484604-id-1941290.html     国际移动用户识别码(IMSI) international mobi ...

  8. NAT模式

    NAT NAT模式中,就是让虚拟机借助NAT(网络地址转换)功能,通过宿主机器所在的网络来访问公网. NAT模式中,虚拟机的网卡和物理网卡的网络,不在同一个网络,虚拟机的网卡,是在vmware提供的一 ...

  9. FinalizableReference, FinalizablePhantomReference, FinalizableReferenceQueue

    FinalizableReference /* * Copyright (C) 2007 The Guava Authors * * Licensed under the Apache License ...

  10. go语言之进阶篇runtime包中 Gosched Goexit GOMAXPROCS的使用

    一.runtime包 1.Gosched的使用 runtime.Gosched() 用于让出CPU时间片,让出当前goroutine的执行权限,调度器安排其他等待的任务运行,并在下次某个时候从该位置恢 ...