zoukankan      html  css  js  c++  java
  • jQuery的效果函数及如何运用

    jQuery是JavaScript的一个库,它是一个轻量型的语言。它不仅有优秀的选择器,还有能实现各种页面效果的函数。下面我们就说说它的这些函数以及能实现怎样的效果。

    1、jQuery中的hide()和show()函数。

    在使用jQuery的时候,我们可以用hide()和show()函数来实现元素的显示和影藏。下面我们通过代码来说明下。

    $("#hide").click(function(){

       $("p").hide();

    });

    在这段代码中元素通过了点击事件调用了hide()函数,就说明当我们点击按钮的时候页面中的p标签会被影藏起来。

    $("#hide").click(function(){

       $("p").show();

    });

    在这段代码中元素通过了点击事件调用了show()函数,就说明当我们点击按钮的时候页面中的p标签会被显示出来。

    2、jQuery中的toggle()函数。

    我们可以通过toggle()函数来直接的切换hide() 和 show() 方法

    当我们为元素调用toggle()函数后,我们就可以通过点击按钮来实现元素的显示和影藏,点击第一次元素显示,第二次元素影藏。

    3、fadeIn()方法是元素的淡入效果,当我们为元素调用该函数时,我们点击按钮元素的透明度将会从0慢慢的显示到1,所看到的效果就是元素慢慢的由浅变深的显示出来。

    4、fadeOut()方法是元素的淡出效果,当我们为元素调用函数时,我们点击按钮元素会由深入浅慢慢的消失。

    5、slideDown()方法是元素折叠显示方法,当我们调用这个函数的时候,元素会向下滑动的显示出来,它有两个参数,第一个参数是它用多长时间来完成这个函数的执行,第二个参数是滑动完成后所的函数名称。

    6、slideUp()方法是元素折叠隐藏方法,当我们调用这个函数的时候,元素会向上滑动直至隐藏起来,它有两个参数,第一个参数是它用多长时间来完成这个函数的执行,第二个参数是滑动完成后所的函数名称。

    7、SlideToggle()方法是方法可以在 slideDown() 与 slideUp() 方法之间进行切换。如果元素向下滑动,则 slideToggle() 可向上滑动它们。如果元素向上滑动,则 slideToggle() 可向下滑动它们

    代码:$(selector).slideToggle(speed,callback);

    可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

    可选的 callback 参数是滑动完成后所执行的函数名称。

    8、jQuery的fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。如果元素已淡出,则 fadeToggle() 会向元素添加淡入效果。如果元素已淡入,则 fadeToggle() 会向元素添加淡出效果

    语法:$(selector).fadeToggle(speed,callback);

    可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

    可选的 callback 参数是 fading 完成后所执行的函数名称。

  • 相关阅读:
    RAID实战案例
    文件系统常用工具实战篇
    挂载文件系统
    硬盘结构类型概述
    创建文件系统实战篇
    JumpServer的会话管理及命令过滤器应用案例
    JumpServer的权限管理
    JumpServer的用户管理
    helm基础
    hpa控制器
  • 原文地址:https://www.cnblogs.com/12315peixin/p/5877224.html
Copyright © 2011-2022 走看看