Saya baru di JQ saya memiliki skrip ini yang saya temukan di internet dan melakukan persis apa yang saya butuhkan tetapi saya ingin geseran akan dari kanan ke kiri bagaimana saya bisa melakukannya? tolong bantu
ini adalah kodenya
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});
});
</script>
<style>
.slidingDiv {
height:300px;
background-color: #99CCFF;
padding:20px;
margin-top:10px;
border-bottom:5px solid #3399FF;
}
.show_hide {
display:none;
}
</style>
</head>
<body>
<div class="slidingDiv">
Fill this space with really interesting content. <a href="#" class="show_hide">hide</a></div>
<a href="#" class="show_hide">Show/hide</a>
Anda bisa melakukan ini menggunakan efek tambahan sebagai bagian dari jQuery-ui
$('.show_hide').click(function () {
$(".slidingDiv").toggle("slide");
});
[Tautan Uji][2]
Saya tahu sudah setahun sejak hal ini ditanyakan, tetapi hanya untuk orang-orang yang akan mengunjungi halaman ini, saya memposting solusi saya.
Dengan menggunakan apa yang @Aldi Unanto sarankan di sini adalah jawaban yang lebih lengkap:
jQuery('.show_hide').click(function(e) {
e.preventDefault();
if (jQuery('.slidingDiv').is(":visible") ) {
jQuery('.slidingDiv').stop(true,true).hide("slide", { direction: "left" }, 200);
} else {
jQuery('.slidingDiv').stop(true,true).show("slide", { direction: "left" }, 200);
}
});
Pertama saya mencegah tautan melakukan apapun saat diklik. Kemudian saya tambahkan pengecekan apakah elemen tersebut terlihat atau tidak. Ketika terlihat saya menyembunyikannya. Ketika tersembunyi saya tampilkan. Anda dapat mengubah arah ke kiri atau kanan dan durasi dari 200 ms ke apa pun yang Anda suka.
Edit: Saya juga menambahkan
.stop(true,true)
untuk clearQueue dan jumpToEnd. Baca tentang jQuery berhenti di sini