1

我有一个使用 jquery 打开子菜单的垂直菜单。有什么办法可以像这样在同一行打开子菜单：

项目
项目 SUBITEM1 SUBITEM2
项目

这是我的代码：
css：

#menu-main { margin: 0;  padding: 0; position:absolute; top:107px;}
#menu-main li{ list-style: none; position:relative; 
height:25px;
        margin:0 2px;
        padding:20px 5px 0 10px;
        color:#FFFFFF;
        font-weight:bold;
        font-size:36px;
        text-transform:uppercase;
        clear: left;}
#menu-main li a{   
background: #000; text-decoration: none; padding: 1px 1px;
z-index:1001;}
#menu-main li a:link, 
    #menu-main li a:visited, 
    #menu-main li a:active {

        text-decoration:none;
        color:#FFFFFF;
    }
#menu-main li a:hover {background: #000; color: white; padding: 1px 6px;}

#menu-main li ul{list-style: none; none; margin: 0; padding: 0; display:none; float:left; z-index:1002; position:absolute;  left:100%; top:0px;}

#menu-main li ul li {float:left; display:inline;}

#menu-main li ul li a:hover {display:inline-block; background: #000; padding: 0px 0px;}

#menu-main li ul li a:link, 
    #menu-main li ul li a:visited, 
    #menu-main li ul li a:active { color:#0CF;}

#menu-main li ul li a:hover{ opacity:1;}


#menu-main > li{   margin-left:0px;}

javascript: 

$(document).ready(function(){ 

// MENU SCRIPT

var timeout    = 500;
var closetimer = 0;
var ddmenuitem = 0;

function jsddm_open()
{  jsddm_canceltimer();
   jsddm_close();
   ddmenuitem = $(this).find('ul').css('display', 'inline-block');}

function jsddm_close()
{  if(ddmenuitem) ddmenuitem.css('display', 'none');}

function jsddm_timer()
{  closetimer = window.setTimeout(jsddm_close, timeout);}

function jsddm_canceltimer()
{  if(closetimer)
   {  window.clearTimeout(closetimer);
      closetimer = null;}}



$('#menu-main > li').bind('mouseover', jsddm_open)
$('#menu-main > li').bind('mouseout',  jsddm_timer)


document.onclick = jsddm_close;

});

在此先感谢您的帮助

4

0 回答 0