WhatsApp İletişim
 0850 888 00 38

MÜŞTERİ GİRİŞİ

TELEFON İLE DESTEK

0850 888 00 38
Telefon ile destek almak için lütfen arayın !

Siteye Accordion Menü Ekleme

 09 Ağustos 2017 - Yazılım

Aşağıdaki kodları kullanarak sitenize Accordion Menü ekleyebilirsiniz ;


<style>

button.accordion {

    background-color: #eee;

    color: #444;

    cursor: pointer;

    padding: 18px;

    width: 100%;

    border: none;

    text-align: left;

    outline: none;

    font-size: 15px;

    transition: 0.4s;

}


button.accordion.active, button.accordion:hover {

    background-color: #ddd; 

}


div.panel {

    padding: 0 18px;

    display: none;

    background-color: white;

}

</style>


<button class="accordion">Başlık 1</button>

<div class="panel">

  <p>Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. </p>

</div>


<button class="accordion">Başlık 2</button>

<div class="panel">

    <p>Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. </p>

</div>


<button class="accordion">Başlık 3</button>

<div class="panel">

    <p>Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. Bu alana içerik gelecektir. </p>

</div>


<script>

var acc = document.getElementsByClassName("accordion");

var i;


for (i = 0; i < acc.length; i++) {

    acc[i].onclick = function(){

        this.classList.toggle("active");

        var panel = this.nextElementSibling;

        if (panel.style.display === "block") {

            panel.style.display = "none";

        } else {

            panel.style.display = "block";

        }

    }

}

</script>

  • Pin It
BANKA HESAP NUMARAMIZ
medyator
Alıcının Adı : FORS BİLİŞİM YAZILIM DONANIM OTOMASYON VE ARGE HİZ.SAN.TİC.LTD. ŞTİ.
Hesap No : 6297267
Şube Kodu : 421 - KAYSERİ
IBAN : TR24 0006 2000 4210 0006 2972 67
YUKARI

PROJENİZ İÇİN TEKLİF ALIN !

ŞİFRE HATIRLATMA