0

私は一種の奇妙な問題に遭遇しました。ブートストラップを使用するビルド済みのワードプレス テーマを使用しています。これはメンターと呼ばれます。これがライブ プレビューhttp://demo.pixelentity.com/?mentorです。ヘッダーのソーシャル アイコンの横にドロップダウン ボタンを追加しようとしています。問題は、ドロップダウンがヘッダー以外の場所で機能することです。関連するすべてのコードは次のとおりです。

CSS:

header #user_menu{
    position:absolute;
    float:right;
    margin-top:20px;    
    margin-left:660px;
    width:350px
}

HTML:

<!--header and menu-->
    <header class="navbar navbar-fixed-top" id="top">
    <div class="navbar-inner">
        <div class="container">
            <div id="user_menu"></div>
                           ...

Javascript:

 $("#user_menu").append('<div class="btn-group" 
style="float:left; margin-left:5px; margin-top:-2px;"> 
<a class="btn btn-primary" href="http://beta.orangegeek.com/contact">
<i class="icon-cog icon-white"></i>My Account</a> 
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
<span class="caret"></span></a>
 <ul class="dropdown-menu"><li>
<a href="#"><i class="icon-book"></i>Billing</a></li>
<li><a href="#"><i class="icon-globe"></i>Domains</a></li>
<li><a href="#"><i class="icon-lock"></i>Change Password</a></li>
</ul>
</div>');

JS が正しくフォーマットされていないことはわかっていますが、この方法の方が読みやすいと思いました。サンプルコードをコピーして貼り付けることができ、それでもドロップダウンしないので、それが問題だとは思いません。

私が言ったように、このコードはヘッダー以外のどこでも機能します。

何か案は？この時点で他に何を試すべきかわかりません。

4

0 に答える 0