slideToggle()方法jQuery中的分别用于显示隐藏的元素或隐藏可见的元素, 即它在slideUp()和slideDown()方法之间切换。
- 当元素隐藏时, 将运行slideDown()。
- 当元素可见时, 将运行slideUp()。
$(selector).slideToggle()( speed, easing, callback )
参数:此方法接受上述和以下所述的三个参数:
- 速度:它是一个可选参数, 用于指定衰落效果的速度。速度的默认值为400毫秒。可能的速度值为:
- 毫秒
- "slow"
- "fast"
- 缓和:它是一个可选参数, 用于指定元素到动画不同点的速度。缓动的默认值为" swing"。放松的可能值是:
- "swing"
- "linear"
- callback:它是可选参数。在slideToggle()方法完成后, 将执行回调函数。
例子:本示例显示或隐藏元素。
<
!DOCTYPE html>
<
html >
<
head >
<
title >
jQuery slideToggle() Method
<
/ title >
<
script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
<
/ script >
<
!-- Script to illustrates slideToggle() method -->
<
script >
$(document).ready(function() {
$("button").click(function() {
$("h1").slideToggle();
});
});
<
/ script >
<
/ head >
<
body >
<
h1 style = "color:green" >
lsbin
<
/ h1 >
<
button >
Click on button to hide/show content
<
/ button >
<
/ body >
<
/ html >
输出如下:
在单击按钮之前:
文章图片
单击按钮后:
文章图片
【jQuery如何使用slideToggle()方法(代码示例)】双击按钮后:
文章图片
推荐阅读
- 操作系统中的资源分配图(RAG)详细指南
- ER图中的递归关系简要介绍
- 使用JavaScript获取数组中的第一项和最后一项
- sprinklr面试经验分享|S5(校园内–产品工程师的FTE)
- JavaScript Instanceof运算符如何使用(代码示例)
- 雨林木风windows10专业版镜像介绍
- 雨林木风win764纯净版介绍
- 联想win7旗舰版64位介绍
- 深度windows7 64位纯净版介绍