Question

我需要一个带分割按钮的下拉菜单... 像分裂按钮组成的导航栏，每个按钮都会有一些文字和箭头，如果你单击它调用处理程序的文本（将显示/隐藏东西），如果你单击箭头，它会在按钮下面打开一个下拉列表。

我想我可以使用JQuery移动拆分列表来完成它，但我仍然需要在水平上列出按钮并打开它们下方的下拉列表...

这是我到目前为止in fiddle

我仍然需要在点击图标上方时打开下拉列表，例如HERE，但点击图标上有。

那我该怎么做呢？有没有办法用导航栏或插件进行操作？

请注意，我无法使用正常的下拉菜单，因为触摸屏没有鼠标悬停在事件上......

Answer 1

而不是尝试使用拆分列表如何为每个拆分列表项创建两个导航按钮。一个人会有文本而另一个人会有图标：

<div data-role="foooter" data-position="fixed">
    <div class="ui-grid-c">
        <div class="ui-block-a">
            <a data-role="button" data-shadow="false" data-corners="false" href="#">Text 1</a>
        </div>
        <div class="ui-block-b">
            <a data-role="button" data-icon="delete" data-iconpos="notext" data-shadow="false" data-corners="false" href="#">Text 2</a>
        </div>
        <div class="ui-block-c">
            <a data-role="button" data-shadow="false" data-corners="false" href="#">Text 2</a>
        </div>
        <div class="ui-block-d">
            <a data-role="button" data-icon="home" data-iconpos="notext" data-shadow="false" data-corners="false" href="#">Text 2</a>
        </div>
    </div>
</div>

以下是演示：http://jsfiddle.net/neSDT/

它当然需要抛光，但这可能会让你开始。

Jquery移动导航栏，带分割按钮和下拉菜单

1 个答案: