2016-04-03 7 views
0

ドロップダウンメニューのコードを入力して以来、scrollspyはドロップダウン内の作業項目を上に移動します。他の要素には適用されません。私は正しいデータターゲットを持っていると確信しています。思考? (。私は何かが欠けする必要がありますブートストラップマニュアルのコード、W3、および他の人のサイトを参照しようとしました。)Scrollspyのみドロップダウンメニューに適用

<body data-spy="scroll" data-target=".navbar"> 
 
     <div class="container-fluid"> 
 
     <nav class="navbar navbar-inverse, navbar-fixed-top"> 
 
      <div class="container-fluid"> 
 
      <div class="navbar-header"> 
 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mynavbar"> 
 
       <span class="sr-only">Toggle navigation</span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       </button> 
 
       <div class="home navbar-brand"> 
 
       <a href="#">Home</a> 
 
       </div><!-- end home --> 
 
      </div><!-- end navbar-header --> 
 
      <div class="collapse navbar-collapse" id="mynavbar"> 
 
       <ul class="nav navbar-nav navbar-right"> 
 
       <li><a href="#about-section">About</a></li> 
 
       <li class="dropdown"> 
 
        <a class="dropdown-toggle" data-toggle="dropdown" href="#"> 
 
        "Work" 
 
        <span class="caret"></span> 
 
        </a> 
 
       <ul class="dropdown-menu"> 
 
        <li><a href="#work-section">Work 1</a></li> 
 
        <li><a href="#work-section">Work 2</a></li> 
 
       </ul> 
 
        </li> 
 
       <li><a href="#faq-section">FAQ</a></li> 
 
       <li><a href="#contact-section">Contact</a> 
 
       </li> 
 
       </ul> 
 
      </div><!-- nav --> 
 
      </div><!--/nav container --> 
 
     </nav><!--/navbar -->

答えて

0

これは遅すぎるオリジナルポスターのために、おそらくです - 他の誰かがこの問題に遭遇した場合は、ドロップダウンリンクのターゲットdivs(またはその他の要素)が隠されている可能性があります。 BootstrapのScrollSpyの公式ドキュメントによると:

"表示されないターゲット要素は無視されました jQueryで表示されないターゲット要素は無視され、対応するナビゲーション項目は決して強調表示されません。 (http://getbootstrap.com/javascript/#scrollspy

これは、ドロップダウンリンクのターゲットが非表示(非表示)の場合、SpyScrollプラグインが動作しないことを意味します。

回避策は、ドロップダウンにいくつかの他の空の要素のhref idを目的のセクションのすぐ上と下に追加することです。私の要点を理解するのは明らかではないかもしれません。誰かがさらに明確化を必要としている場合、私に知らせてください:-)

関連する問題