EN
jQuery - toggle element
9 points
In this article, we would like to show you how to toggle elements using jQuery.
xxxxxxxxxx1
2
<html>3
<head>4
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>5
</head>6
<body>7
<div id="text">This is example text...</div>8
<button id="toggle-text">Toggle text</button>9
<script>10
11
$(document).ready(function() {12
var text = $('#text');13
14
$('#toggle-text').click(function() {15
text.toggle();16
});17
});18
19
</script>20
</body>21
</html>xxxxxxxxxx1
2
<html>3
<head>4
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>5
</head>6
<body>7
<div id="text">This is example text...</div>8
<button id="toggle-text">Toggle text</button>9
<script>10
11
var duration = 1000; // animation duration in milliseconds12
13
$(document).ready(function() {14
var text = $('#text');15
16
$('#toggle-text').click(function() {17
text.toggle(duration);18
});19
});20
21
</script>22
</body>23
</html>