目前正在设计如下图所示的菜单栏。期望做到两点：

    1，当菜单栏中的菜单名称（如下图的菜单1，菜单2等等）较多时，能够横向滚动，全部显示。包括最后一个菜单名称对应的菜单内容。

    2，当单击菜单名称时，其对应的菜单能自动弹出（如单击菜单1时，显示其下的Hello，子菜单）。为了实现这一点，菜单内容是放在 一个绝对定位的浮动view层中。

为了能够横向滚动，使用了scroll-view。但把菜单名称放进scroll-view层之后，就无法自动弹出其菜单内容。因为就我目前所知，scroll-view的高度不能自动变化。如果不使用scroll-view，则无法实现横向滚动。请求大神帮我解决这个两难的问题。

wxml代码如下：

<scroll-view scroll-x="true" class="MenuBar">

<block wx:for="{{MenuBar.MenuList}}" wx:key="{{id}}" wx:for-item="Menu">    

<view style="display:inline-block;margin:10px;" bindtap="{{MenuBar.bindtap}}" id="{{Menu.Name}}">{{Menu.Name}}

<template is="PopMenu" data="{{Pop:Menu,Style:MenuBar.MenuStyle,SubMenuHidden:MenuBar.SubMenu.Hidden}}" />

</view>

</block>

</scroll-view>

<template name="PopMenu">

<view class="PopMenuContainer" >

<view hidden='{{Pop.Hidden}}' class="PopMenu" catchtap="{{bindtap}}" id="{{Pop.Name}}">

<template is="MenuItem" data="{{Menu:Pop,Style,SubMenuHidden:SubMenuHidden}}" />

</view>

</view>

</template>‍

左图是添加了scroll-view之后的效果，右图是没有添加scroll-view的效果。