视频聊天源码的jQuery 效果, 隐藏和显示
时间:2021-09-03
本文章向大家介绍视频聊天源码的jQuery 效果, 隐藏和显示,主要包括视频聊天源码的jQuery 效果, 隐藏和显示使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
视频聊天源码的jQuery 效果, 隐藏和显示实现的相关代码
可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素,它的语法为:
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
speed :显示元素出现的速度,通常以毫秒表示,也可以使用fast和slow 。
callback :(可选) 参数是隐藏或显示完成后所执行的函数名称。
下面写出了hide(speed)方法和show(speed)方法:
<style> p{ width: 300px; background-color: yellow; text-align: center; } </style> // body部分 <body> <button id="hide">点击我p1将会被隐藏</button> <button id="show">点击我p1将会显示出来</button> <p>p1</p> <script src="../jquery-3.6.0.js"></script> <script> $('#hide').click(function(){ $('p').hide(1000); }); $('#show').click(function(){ $('p').show(1000); }) </script> </body>
下面例子写出了带有 speed 参数的 hide() 方法,并使用回调函数:
// style 样式 <style> div { display: inline-block; width: 130px; height: 50px; padding: 15px; margin: 15px; background-color: green; } </style> // body部分 <body> <div>隐藏以及设置回调函数</div> <br> <button class="hidebtn">点击此处隐藏</button> <script src="../jquery-3.6.0.js"></script> <script> $(document).ready(function () { $('.hidebtn').click(function () { // jQuery自身提供"linear" 和 "swing",其他可以使用相关的插件 $('div').hide(1000, 'linear', function () { //第二个参数是一个字符串,表示过渡使用哪种缓动函数。 alert('方法已经调用完毕'); //当此函数执行完毕后回调alert内容 }); }) }) </script> </body>
以上就是 视频聊天源码的jQuery 效果, 隐藏和显示实现的相关代码,更多内容欢迎关注之后的文章
原文地址:https://www.cnblogs.com/yunbaomengnan/p/15222958.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法