0

Web サイトの先頭にあるメニューを表示する独自のスクリプトを作成しましたが、いくつか問題があります

基本的な問題は、

  1. メニューを表示するためのリンクの上にマウスを置くと、最初の瞬間にメニューが完全に表示されます。

  2. しかし、メニュー show の div - show until - の上にマウスを置くと、このメニューは常に非表示になり、残りません

このスクリプトで私は表示しようとしてdivいて、マウスがこれから出たらdiv非表示にします

私のスクリプトはこれです：

function menu(id,width,color)
{

$(".men"+id).mouseover(function(e) {

//
//$(".m"+id).show("blind", { direction: "vertical" }, 500);
//$(".m"+id).show(500);

$(".m"+id).css("width",""+width);
$(".m"+id).show("slide", { direction: "up" }, 500);
$(".m"+id).css("background-color",""+color);

e.stopPropagation();
e.stopImediatePropagation();

});

$(".m"+id).mouseout(function(e) {


$(this).hide(500);
e.stopPropagation();
e.stopImediatePropagation();

});

}

CSS スタイル :

#content_menu
{
margin-top:7px;
position:absolute;
min-height:50px;
height:auto;
border:1px solid;
text-align:left;
font-family:Arial;
font-size:12px;
z-index:2;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}

#content_menu_into
{
position:relative;
width:98%;
min-height:28px;
height:auto;
line-height:28px;
font-family:Arial;
font-size:14px;
color:#000000;
padding-left:2%;
text-align:left;
}

そして call script の場合:

   <a href="#" onmouseover="javascript:menu('1','200','#000000');" class="men1">
   Home Web Menu
   </a>


    <div id="content_menu" class="m1" style="display:none;">
    <div id="content_menu_into">
    Home
    News
    Articles
    Users
    Vote
    </div>
    </div>

助けてくれてありがとう、明けましておめでとうございます!!!

4

1 に答える 1

0

修正する必要があるのは次の 2 つです。

  1. （あなたの質問には答えません）：イベントでmenu機能を実行しています。mouseoverそして、あなたがすることは、 （および）menuをバインドすることです。それは少し冗長です。に電話してください。mouseovermouseoutmenudocument.ready
  2. （これはあなたの質問に答えます）：マウスが両方の外にある場合にのみ、メニューを非表示にする必要があります：m1とmen1。

好奇心によると、既存のすべてのメニュー プラグインを使用しないのはなぜですか?

于 2012-12-31T15:13:30.547 に答える