hide([speed,[easing],[fn]])

概述

隐藏显示的元素

这个就是 'hide( speed, [callback] )' 的无动画版。如果选择的元素是隐藏的，这个方法将不会改变任何东西

参数

[speed],[easing],[fn]

   speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如：1000)

   easing:(Optional) 用来指定切换效果，默认是"swing"，可用参数"linear"

   fn:在动画完成时执行的函数，每个元素执行一次

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>

        <script type="text/javascript">

            $(function(){

                $("button").click(function(){

                    $("p").eq(0).hide();

                    $("p:eq(1)").hide("slow");

                    $("p:eq(2)").hide("slow",function(){

                        $("button").css("color","#FF0000");

                    });

                });

            });

        </script>

    </head>

    <body>

        <p>第一个段落。</p>

        <p>第二个段落。</p>

        <p>第三个段落。</p>

        <button>点击我，隐藏段落</button>

    </body>

</html>

show([speed,[easing],[fn]])

概述

显示隐藏的匹配元素

这个就是 'show( speed, [callback] )' 无动画的版本。如果选择的元素是可见的，这个方法将不会改变任何东西。无论这个元素是通过hide()方法隐藏的还是在CSS里设置了display:none;，这个方法都将有效

参数 

[speed],[easing],[fn]

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如：1000)

   easing:(Optional) 用来指定切换效果，默认是"swing"，可用参数"linear"

   fn:在动画完成时执行的函数，每个元素执行一次

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>

        <style type="text/css">

            p{

                display: none;

            }

        </style>

        <script type="text/javascript">

            $(function(){

                $("button").click(function(){

                    $("p").eq(0).show();

                    $("p:eq(1)").show("slow");

                    $("p:eq(2)").show("slow",function(){

                        $(this).css("color","#FF0000");

                    });

                });

            });

        </script>

    </head>

    <body>

        <p>第一个段落。</p>

        <p>第二个段落。</p>

        <p>第三个段落。</p>

        <button>点击我，显示段落</button>

    </body>

</html>

jQuery效果--show([speed,[easing],[fn]])和hide([speed,[easing],[fn]])的更多相关文章

  1. jQuery效果------隐藏hide()/显示show()

    hide()和show() hide():隐藏文本. show():显示文本. 语法: $(selector).hide(speed,callback); $(selector).show(speed ...

  2. jquery 效果

    效果1.基本效果    1.1 show([speed,[easing],[fn]]) 如果元素本身是可见的,则不对其作任何改变.如果元素是隐藏的,则使其可见.        $("p&qu ...

  3. 【Python全栈-JavaScript】jQuery效果

    jQuery效果 jQuery 效果函数: 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选 ...

  4. jquery 效果笔记

    jquery效果 显示隐藏     show()     语法     show([speed,[easing],[fn]])     参数可以省略,无动画直接使用     hide()     to ...

  5. jQuery 效果 —— 隐藏和显示

    jQuery 效果 -- 隐藏和显示 1.隐藏和显示 (1)在jQuery中我们可以使用hide()和show()分别隐藏和显示HTML元素: //隐藏元素 $("button") ...

  6. JQuery: JQuery效果（隐藏、显示、切换，滑动，淡入淡出，以及动画）

    JQuery:效果 JQuery效果有很多,包括隐藏.显示.切换,滑动,淡入淡出,以及动画等.隐藏:JQuery hide() 显示:JQuery show() 切换:JQuery toggle() ...

  7. jQuery 效果 - animate() 方法

    http://www.w3school.com.cn/jquery/effect_animate.asp 实例 改变 "div" 元素的高度: $(".btn1" ...

  8. <五> jQuery 效果

    显示隐藏 $("selector").show(speed, callback) $("selector").hide"(speed, callbac ...

  9. Jquery效果代码--（二）

    //jQuery 效果- 隐藏和显示.通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: //掩藏效果演示: $(document).ready(fun ...

随机推荐

  1. Java之旅_高级教程_多线程编程

    摘自:http://www.runoob.com/java/java-multithreading.html Java 多线程编程 Java 给多线程编程提供了内置的支持.一条线程指的是进程中的一条执 ...

  2. elasticsearch更新doc文档

    在elasticsearch-head中: http://localhost:9200/my_index/products/2/ _update { "script" : { &q ...

  3. 程序------>数据结构

    一程序概念: 1.对身边的任何一个事物进行认知和分类,从而得到一些信息: 2.在得到的信息基础之上建立了概念模型: 3.根据概念模型将我们生活中的实际问题转换成计算机能理解的形式: 4.用户通过人机交 ...

  4. RSA 理论

    一.同余 给定一个正整数m,如果两个整数a和b满足(a-b)能够被m整除,即(a-b)/m得到一个整数,那么就称整数a与b对模m同余,记作a≡b(mod m) 二.欧拉定理 任意给定正整数n,请问在小 ...

  5. Linux ethtool 命令

    ethtool 是用于查询及设置网卡参数的命令,常见用法如下: 注意:该命令只是临时设置,如果网卡重启就失效了,如果想要永久保存应该配置 /etc/sysconfig/network-scripts/ ...

  6. Mysql事务原理介绍

    事务 一个事务会涉及到大量的cpu计算和IO操作,这些操作被打包成一个执行单元,要么同时都完成,要么同时都不完成. 事务是一组原子性的sql命令或者说是一个独立的工作单元,如果数据库引擎能够成功的对数 ...

  7. 009-ThreadPoolExecutor运转机制详解，线程池使用1-newFixedThreadPool、newCachedThreadPool、newSingleThreadExecutor、newScheduledThreadPool

    一.ThreadPoolExecutor理解 为什么要用线程池: 1.减少了创建和销毁线程的次数,每个工作线程都可以被重复利用,可执行多个任务. 2.可以根据系统的承受能力,调整线程池中工作线线程的数 ...

  8. C# install-package:"xx"已拥有为“xxx”定义的依赖项

    可能 nuget自身的版本落后于适配程序包的版本 Visual Studio 2013 更新 NuGet 包管理器 Ø  前言 使用 Visual Studio 中的 NuGet 包管理器下载程序时, ...

  9. vue中indexDB的应用

    // indexedDB.js,浏览器本地数据库操作 export default { // indexedDB兼容 indexedDB: window.indexedDB || window.web ...

  10. 通过wui登陆 sap 页面对数据进行高级 搜索

    1: 登陆QGL系统. 在 T-CODE搜索框输入wui 会跳到搜索的web页面,进行搜索. 或者浏览器输入: https://ldciqgl.wdf.sap.corp:44300/sap(bD1lb ...