单页导航仅在滚动后可触摸

时间:2012-09-25 13:18:50

标签: jquery mobile navigation

我构建了一个对移动设备具有响应能力的单页。 我正在为menü使用固定位置。 Theres是一个菜单按钮,在“触摸”后显示一个子按钮。这很完美。但是在使用菜单项之后我必须首先滚动页面才能再次单击菜单按钮。

任何想法为什么会这样?

这个用于切换子菜单-div:

<script>
          $('#navmobile').click(function(){
             $('.submenu').toggle();
          });

</script>

这个子菜单如下:

<ul id="navmobile">
                        <li><a href="">MENÜ</a></li>
                            <ul class="submenu">
                              <li class="current"><a href="#section-1">Einleitung</a></li>
                              <li><a href="#section-2">Menüpunkt1</a></li>
                              <li><a href="#section-3">Menüpunkt2</a></li>
                              <li><a href="#section-4">Menüpunkt3</a></li>
                              <li><a href="#section-5">Menüpunkt4</a></li>
                            </ul>
                    </ul>

和css:

#navmobile {display: block !important; z-index: 100000}
    #navmobile li {float: left; list-style: none; margin: 0 18px 0 0; font-size: 26px; text-transform: uppercase; font-weight: bold; -moz-margin-end: 26px}
    #navmobile li a {text-decoration: none;padding: 2px 4px;}
    #navmobile li.current a, li:hover a{color: #fff; background: #2b9ad0}
    #navmobile .submenu {display: none}
    #navmobile .submenu {width: 300px; position: absolute; left:-130px; top: 35px; background: #efefef; padding: 5px; border: 2px solid #ddd;border-radius: 1px}
    #navmobile .submenu li a{font-size: 30px; text-align: right; line-height: 60px}

和导航器周围的容器的css:

    .navigation {width: 200px !important;height: 20px;position: fixed;top: 45px;left: 400px}

1 个答案:

答案 0 :(得分:0)

自己弄明白了。这是

  • Menü
  • 的高度。你确定了比平时更大的高度。