Postingan lainnya
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
Membuat toggle show/hide dengan jquery
Malam sobat, mau tanya dong kalau untuk membuat toggle dengan jquery otomatis tertutup atau hide saat saya klik toggle lain bagaimana yaa? mohon pencerahannya
0
4 Jawaban:
Jawaban Terpilih
Coba
$("#hide").click(function(){
$("#target").hide();
});
$("#show").click(function(){
$("#target").show();
});
1
walau sudah menemukan jawabannya tapi saya penasaran, barusan coba-coba, barangkali bisa jadi tambahn hehehe
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
var self = this
$("p.toggle").each(function() {
if(this.id !== "paragraf-" + self.id) {
$("p#" + this.id).css('display','block');
}
});
$("p#paragraf-" + this.id).toggle();
});
});
</script>
</head>
<body>
<p id='paragraf-toggle-1' class="toggle">Ini toggle 1</p>
<p id='paragraf-toggle-2' class="toggle">Ini toggle 2</p>
<p id='paragraf-toggle-3' class="toggle">Ini toggle 3</p>
<button id='toggle-1'>Button 1</button>
<button id='toggle-2'>Button 2</button>
<button id='toggle-3'>Button 3</button>
</body>
</html>
1
