Jak zaimplementować twitter bootstrap accordion?

Próbuję zaimplementować wtyczkę zwinięcia bootstrap twitter (http://twitter.github.io/bootstrap/2.3.2/javascript.html#collapse) i nie mogę sprawić, żeby działała. Myśląc, że było coś złego w moim środowisku programistycznym, skonfigurowałem JSfiddle i nadal mam te same problemy. Oto jsfiddle:Jak zaimplementować twitter bootstrap accordion?

http://jsfiddle.net/qdqrT/1/

Oto HTML, która została skopiowana bezpośrednio z bootstrap przykład.

<div class="accordion" id="accordion2"> 
    <div class="accordion-group"> 
    <div class="accordion-heading"> 
     <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne"> 
     Collapsible Group Item #1 
     </a> 
    </div> 
    <div id="collapseOne" class="accordion-body collapse in"> 
     <div class="accordion-inner"> 
     Anim pariatur cliche... 
     </div> 
    </div> 
    </div> 
    <div class="accordion-group"> 
    <div class="accordion-heading"> 
     <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo"> 
     Collapsible Group Item #2 
     </a> 
    </div> 
    <div id="collapseTwo" class="accordion-body collapse"> 
     <div class="accordion-inner"> 
     Anim pariatur cliche... 
     </div> 
    </div> 
    </div> 
</div>

CSS i javscript wzięto bezpośrednio ze strony dostosowywania bootstrap, tylko CSS i JS, upadku i trasition JS (co jest warunkiem uruchomienia wtyczki upadku).

Ktoś wie, dlaczego to jest zepsute?

Źródło

2013-04-10 larkfofty

Mam to działa. Myślę, że możesz nie uwzględniać wszystkich wymaganych zasobów.

skończyło się na tym obsługiwanej wersji bootstrap CSS i JS z BootstrapCDN

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script> 
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">

Oto wersja robocza: http://jsfiddle.net/qdqrT/3/

Źródło

2013-04-10 02:23:34 lightswitch05

To świetnie, dziękuję za odpowiedź. Wolałbym jednak nie włączać całej struktury bootstrap tylko do funkcji collapse. Jestem trochę zdezorientowany, dlaczego niestandardowy pakiet bootstrap nie działa. – larkfofty

Będę musiał spojrzeć na to więcej, ale myślę, że twoja wersja nie działa, ponieważ brakuje ci niektórych reguł CSS, które by się stosowały, nie dlatego, że brakuje ci javascriptu. – lightswitch05

próbowałem go z nowszej wersji (3.3.4) bootstrap a kod w pytaniu działał, gdy uwzględniono poprawne pliki.

Nie trzeba używać wersji bootstrap CDN (ale możesz, jeśli chcesz).

Mam bootstrap w podkatalogu i następujących w moim HTML:

<!-- Bootstrap CSS (put this in the header of your HTML file)--> 
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css"> 

<!-- Bootstrap Javascript (put this at the end of your HTML file)--> 
<script src="bootstrap/js/bootstrap.min.js"></script>

(zdaję sobie sprawę, że kwestia jest stary, ale myślę, że moja odpowiedź jest bardziej aktualne niż przyjętym odpowiedź i mam nadzieję, że go pomoże komuś)

Źródło

2015-03-23 14:29:11 paulo62

Jak zaimplementować twitter bootstrap accordion?

Odpowiedz

Powiązane problemy