JQUERY SlideToggle ile Collapse Panel Yapımı

Bootstrap da oluşturulan paneller, çok basit bir JQUERY kodu ile açılır, kapanır (collapse) özelliğine sahip olabilirler.
Yapılması gereken iş paneldeki başlığa tıklandığında panelin içerik kısmının kapanması veya açılmasıdır.

Bunun için slideToggle() fonksiyonu kullanılır.

Script etiketleri arasına yazılması gereken kod aşağıdaki gibidir.

 $(document).ready(function(){
          $('#cbtn').on('click',function(){
            $('.panel-body').slideToggle();
          });
        });


Yorumlar


Yorum yapabilmek ve kaynak kodları indirebilmek için lütfen üye girişi yapın

Hakkımızda

Bu site, website tasarımı yapılırken frontend(ön yüz) teknolojileri hakkında kısa anlatım ve örnekler paylaşmak amacıyla hazırlanmıştır.

Web tasarımda şu an için en sık kullanılan dil ve frameworkler HTML, CSS, JQUERY ve BOOTSTRAP olması sebebiyle bu alanların üzerinde örnekler ve çalışmalar olacaktır.

İletişim

  • info@frontendokulu.com