2012-12-21 25 views
5

Merhaba Önyükleme kullanarak bir açılır düğme oluşturmaya çalışıyorum. Ama sadece doğru çıkmıyor gibi görünüyor?Bootstrap/Dropdown Düğmesi

<div class="btn-group"> 
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
     Action 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="#">Foo</a></li> 
     <li><a href="#">Bar</a></li> 
    </ul> 
</div> 

bir jsfiddle burada http://jsfiddle.net/UrgP8/

Herhangi bir fikir mi?

sayesinde

+1

Bir javascript sorunu gibi görünüyor: yeni başlayanlar için bootstrap-dropdown.js ve bootstrap.min.js dahil olmak üzere, sadece bir tane gerekir, ancak bu sorunu çözmezsiniz ... – Agush

cevap

7

Pratik html görünüm içine tam boostrap html kaynağı ne yapıştırarak jsfiddle içine dış kaynak ağır bir miktar yüklüyorsunuz.

Burada yalnızca üç harici dosyayı yükleyen çok daha çıplak kemikleri olan bir sürüm var. jQuery jsFiddle Çerçeve paneli üzerinden yüklenmiş olduğundan taban html aynıdır

http://jsfiddle.net/BqKNV/65/

(SO bana kodunda koymadan sonrası izin vermedi ...)

<div class="dropdown btn-group"> 
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
     Action 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="#">Foo</a></li> 
     <li><a href="#">Bar</a></li> 
    </ul> 
</div> 

Not önyükleme

//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css
// netdn: css ve js BootstrapCDN aracılığıyla yüklenir a.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js

Bir sayfa olarak bu html kaydetmek ve tarayıcıda çalıştırmak ne olur

?

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
     <title> - jsFiddle demo</title> 
     <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script> 
     <script type='text/javascript' src="http://twitter.github.com/bootstrap/assets/js/bootstrap.min.js"></script> 
     <link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css"> 
    </head> 
    <body> 
     <div class="dropdown btn-group"> 
     <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
      Action 
      <span class="caret"></span> 
     </a> 
     <ul class="dropdown-menu"> 
      <li><a href="#">Foo</a></li> 
      <li><a href="#">Bar</a></li> 
     </ul> 
     </div> 
    </body> 
    </html> 
+0

tepki. Görünüşe göre hepsi jsfiddle'ta çalışıyorlar, ancak bir tarayıcıda doğrudan çalışır almaz aynı sorunu alıyorum. – felix001

+0

@ felix001 - ne demek istediğinden emin değilim. Kodu kaldırdım, birkaç parça daha kaldırıldı, jsfiddle'daydı. Bunu bir tarayıcıda çalıştırdığınızda ne olur? – mg1075

+0

Birçok Teşekkürler, şimdi çalışıyor onun js betikleri yükleme nasıl olduğunu düşünüyorum. – felix001

4

Kemanda sorun ne görünüyorsa bulun.

Size yüklendiğini tespit var:

<link href="http://flip.hr/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 

ben bunu değiştirdi:

<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" /> 

Ve bu temelde bunu çözdü. sürümü buradan görebilirsiniz:


Ama bunun yanı sıra http://jsfiddle.net/6hPMb/1/, ben yorum olarak bahsedilen Sorun hala, her iki önyükleme-dropdown.js ve bootstrap.min.js

yüklüyoruz standları

Yalnızca bir tane kullanmalısınız.