jquery - 編集アクション サブメニューを含むナビゲーション メニュー

Question

Web アプリケーションでは、<ul>. 特に派手なことはありません。それぞれ<li>にパディングと色があります。

アクション メニューを作成して、マウスをその<li>下に表示される小さなメニューの 1 つにマウスを合わせると、マージンの右側にスナップされて<ul>部分的に表示され、アクション自体の上にマウスを移動すると完全に表示されるようにする方法を見つけようとしています。 . Word 2007 以降でハイライトされたテキストのチャンクがある場合の動作に似ています。

この場合、アクションは、編集、削除、上に移動、下に移動などです。

これが私の基本的なレイアウトです：

<div id="nav-menu">
    <div class="tab-control-menu">some action items</div>
    <ul id="tab-list">
        <li class="nav-item tab">
            <a tab="tab1" tab-id="1" class="selected tab">Tab 1</a>
        </li>
        <li class="nav-item tab">
            <a tab="tab2" tab-id="2" class="tab">Tab 2</a>
        </li>
        <li class="nav-item tab">
            <a tab="tab3" tab-id="3" class="tab">Tab 3</a>
        </li>
        <li class="nav-item tab">
            <a tab="tab4" tab-id="4" class="tab">Tab 4</a>
        </li>
        <li class="nav-item">
            <a href="#" class="new-tab">Add New...</a>
        </li>
    </ul>
</div>

このようなアクション メニューを作成する最善の方法は何ですか?