jQuery-তে slideToggle পদ্ধতি

পরবর্তী পদ্ধতি - slideToggle এইভাবে কাজ করে: যদি উপাদানটি লুকানো থাকে - তা প্রদর্শন করে, আর যদি প্রদর্শিত হয় - তা লুকিয়ে দেয়। এই পদ্ধতির সুবিধা হলো যে এটা সব একটি বাটনে লাগানো যায়, পূর্ববর্তী পাঠগুলোতে যেমন দুইটিতে করতে হতো।

নিম্নলিখিত উদাহরণটি দেখা যাক। ধরি আমাদের HTML কোড এইরকম:

html<button id="toggle">click me</button>
<div id="elem">text...</div>

CSS ও আছে:

css#elem {
  padding: 10px;
  width: 150px;
  height: 150px;
  border: 1px solid green;
  margin-top: 10px;
}

এখন এমন কোড লিখি যাতে একটি বাটনে ক্লিক করলে উপাদানটি কখনও লুকিয়ে যায়, কখনও প্রদর্শিত হয়:

javascript$('#toggle').click(function() {
  $('#elem').slideToggle(1000);
});