Home > Web Front-end > JS Tutorial > jQuery effect - toggle() method introduction

jQuery effect - toggle() method introduction

零下一度
Release: 2017-06-26 14:56:21
Original
1176 people have browsed it

jQuery Effect - toggle() method

$(".btn1").click(function(){  $("p").hide();});
Copy after login

Definition and usage

toggle() method switches the visible state of an element.

If the selected elements are visible, then hide these elements. If the selected elements are hidden, then display these elements.

Syntax

$(selector).toggle(speed,callback,switch)
Copy after login
Parameters Description
speed

Optional. Specifies how quickly an element goes from visible to hidden (or vice versa). Default is "0".

Possible values:

  • milliseconds (e.g. 1500)

  • "slow"

  • "normal"

  • "fast"

When the speed is set, during the process of the element going from visible to hidden, Gradually changes its height, width, margins, padding, and transparency.

If this parameter is set, the switch parameter cannot be used.

callback

Optional. The function to be executed after the toggle function is executed.

To learn more about callbacks, visit our jQuery Callback chapter.

This parameter cannot be set unless the speed parameter is set.

switch ##Optional. Boolean value. Specifies whether toggle hides or shows all selected elements.

  • True - Show all elements

  • False - Hide all elements

If this parameter is set , the speed and callback parameters cannot be used.

Tips and Notes

Note: This effect works on elements hidden via jQuery, or by declaring display:none in CSS elements (but not elements with visibility:hidden).

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

$("p").toggle(1000);
});

$(document ).ready(function(){

$(".btn1").click(function(){
$("p").toggle(true);
});
} );

The above is the detailed content of jQuery effect - toggle() method introduction. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template