0

嗨,伙计们,我正在用 twitter bootstrap 建立一个网站,目前我遇到了这个 .nav-collapse 类的问题。一旦网站调整大小并出现扳手按钮,它将变得无法点击。

这是错误的代码和 JS Fiddle

<div class="container">
  <div class="navbar-wrapper">      
    <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->      
    <div class="container">       

      <div class="navbar navbar-inverse">          
        <div class="navbar-inner">
          <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. --> 
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">              
            <span class="icon-bar">
            </span>              
            <span class="icon-bar">
            </span>              
            <span class="icon-bar">
            </span>            
          </a>  
          <a class="brand" href="index.html">SingPath</a> 
          <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
          <div class="nav-collapse collapse">
            <ul class="nav pull-right">
                <li> 
                  <a href="index.html#/quests">Quests</a>
                </li>
                <li> 
                  <a href="index.html#/practice">Practice</a>
                </li>
                <li> 
                  <a href="index.html#/teach">Challenges</a>
                </li>
                <li> 
                  <a href="index.html#/ranking">Rankings</a>
                </li>
                <!-- Read about Bootstrap dropdowns at http://twitter.github.com/bootstrap/javascript.html#dropdowns -->                 
                <li class="dropdown">                  
                  <a href="" class="dropdown-toggle" data-toggle="dropdown">More... 
                    <b class="caret"></b></a>                  
                  <ul class="dropdown-menu">                    
                    <li>
                    <a href="index.html#tournaments">Tournaments</a>
                </li>                    
                <li>
                <a href="index.html#trials">Trials</a>
                </li>                    
                <li>
                <a href="index.html#challenges">Events</a>
                </li>                    
                <li>
                <a href="index.html#rankings">Statistics on Tournaments</a>
                </li>     
                <li>
                <a href="index.html#challenges">Teaching</a>
                </li>
                <li>
                <a href="index.html#challenges">Contribute Problems</a>
                </li>               
                <li class="divider">
                </li>                    
                <li class="nav-header">Create
                </li>                    
                <li>
                <a href="index.html#challengeCreator">Challenges</a>
                </li>                    
                <li>
                <a href="index.html#story">Story</a>
                </li>                    
                <li>
                <a href="#">Tutorials</a>
                </li>                                     
              </ul>                
              </li>
                <li>
                  <a href="index.html#profile">Profile</a>
                </li>                           
              </ul>            
            </div>
            <!--/.nav-collapse -->  
       </div>
        <!-- /.navbar-inner -->        
      </div>
      <!-- /.navbar -->   
    </div> 
    <!-- /.container -->    
  </div>

http://jsfiddle.net/wowlihe/bSZW2/

有人知道为什么会这样吗?非常感谢!

4

1 回答 1

1

您缺少所需的 javascript 文件……对于这个,它是bootstrap-collapse.js.

工作 jsfiddle (by thefourtheye) - http://jsfiddle.net/bSZW2/1/

于 2013-06-16T07:32:47.173 回答