在下拉菜单中更改CSS下拉菜单

我几乎可以肯定这个问题已经以某种形式得到解答。应用我在这里和其他地方找到的更改似乎没有让我更进一步。在下拉菜单中更改CSS下拉菜单

我正在尝试将css菜单从crisislab.nl从下拉菜单更改为下拉菜单。（正如你可以在网站上看到我目前正在处理它。）

我遇到的当前问题是菜单似乎工作正常，期望菜单文本向下显示以及而菜单正在向上移动（如果这听起来不合逻辑，请查看crisislab.nl）

请参阅下面的代码以了解我当前的进度。任何人愿意协助？

非常感谢提前！

下拉框有top:<x>px;，如果你想有一个dropup你刚才说：bottom:<x>px;

我修改你的代码

   #navigation { 
       width: 980px; 
       height: 38px; 



     } 
      #navigation li { 
       float: left; 
       position: relative; 

           top: 220px; 
      } #navigation li:hover { background: transparent url(gfx/navigation_hover.png) repeat; } 
       #navigation li a { 
        text-transform: uppercase; 
        color: white; 
        padding: 13px 33px; 
        line-height: 38px; 
        font-size: 11px; 
       } 
        #navigation li a:hover { text-decoration: none;} 
        #navigation li ul { 

         position: absolute; 
         background: transparent url(gfx/navigation_hover.png) left top repeat; 
         z-index: 1000; 
         min-width: 100%; 
               display:none; 
               left:-1px; 
        } 
        #navigation li:hover ul { 


                 display:block; 

        } 
         #navigation li ul li { 
          background: none; 
          width: 100%; 
        } 
          #navigation li ul li:hover { 
            background: none; 
           background-color: #2a51b5; 



          } 
          #navigation li ul li a { 
           text-transform: uppercase; 
           color: white; 
           padding-left: 8px 10px; 
           line-height: 28px; 
           width: 100%; 
           display:block; 



          }

来源

2012-06-08 Nathan Quite

请解决您遇到的问题 – iddo

修复时我会这样做。目前正在开展工作，并希望在十分钟左右完成。 –

和你的菜单有多远？你能把这些变化应用到例子小提琴吗？ – Christoph

从下拉到dropup的基本区别是孩子ul偏移使其工作：http://jsfiddle.net/fJSVz/

基本上我改变了以下规则：

#navigation li ul { 
    top: -9999px;  /* <- removed */ 
    display:none;  /* <- this will trigger the hide/show */ 
} 
#navigation li:hover ul { 
    bottom:20px;   /* <- this is the trick to push the ul up */ 
    display:block;  /* <- show the ul on hover */ 
}

来源

2012-06-08 08:59:06 Christoph

谢谢！我会看看我能否修复它。我是一个新手，基本上纠正某人失误，但我应该到达那里:-)。 –

@NathanQuite如果你还有其他问题，请尝试一下，稍微玩一下 - 只要问一下;） – Christoph

在这一点上，当我试图将你的修改应用到网站时，我似乎被卡住了某处（参见crisislab.nl）。我已经能够把菜单放在正确的位置，但现在文字apears再次下降而不是up。任何额外的帮助将不胜感激！ –

在下拉菜单中更改CSS下拉菜单

回答

相关问题