0

このように横に表示されるナビゲーションメニューがあります。

                <div id="menucontainer">
                <ul id="menu">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li>@Html.ActionLink("About Us", "About_Us", "Home")</li>
                    <li>@Html.ActionLink("What We Do", "What_We_Do", "Home")</li>
                    <li>@Html.ActionLink("FAQ's", "Answers_To_Questions", "Home")</li>
                    <li>@Html.ActionLink("Deed Transfer Gurantee's", "Deed_Transfer_Guarantee", "Home")
                    </li>
                    <li>@Html.ActionLink("Power Point", "Index", "Home")</li>
                    <li>@Html.ActionLink("Get Help", "Index", "Home")</li>
                    <li>@Html.ActionLink("Mortgage Cancellation", "Index", "Home")</li>
                    <li>@Html.ActionLink("Contact", "Index", "Home")</li>
                </ul>
            </div>

特定のリンクがマウスオーバーされたときにのみ表示されるドロップダウン リンクを作成する方法を探しています。Deed_Transfer_Guarantee にカーソルを合わせたときに別の ActionLink を表示するには、Deed_Transfer_Guarantee ActionLink が必要です。これの明確な例をまだ見つけることができませんでした。助けてくれてありがとう！

4

3 に答える 3

2

このjquery サンプルを確認してください。<span> ***</span>「 」をハイパーリンクに置き換えるだけです

于 2012-06-12T19:28:20.843 に答える
1

これが役立つかもしれません：

$("#menu li a").each(function(){
     var $this = $(this);
     $("<a></a>").html($this.html()).attr("href",$this.attr("href")).addClass("dropdown").slideUp(0).appendTo($this);
}).hover(function(){
    $("a",$(this)).slideDown(500);        
}
,function(){
     $("a",$(this)).slideUp(500);      
});

そして、いくつかのcssが必要です：

#menu li>a{position:relative;}
#menu li a a.dropdown {position:absolute;left:0px;top:100%;}

私はこれが仕事をすることができると思います。

于 2012-06-12T19:36:57.313 に答える
0

新しいliタグを使用すると、オンラインのjqueryの例の「スライドアウト」ではなく、ドロップダウンが表示されると思います。これは本質的にバンブルビーの答えです。

<script> 
$(document).ready(function(){

$("#Deed Transfer Gurantee's").hover(function(){
 $(this).append($('<li>@Html.ActionLink(@*whatever parameters you need*@)</li>'));
    });
 });
</script>
于 2012-06-12T19:39:35.173 に答える