| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677 | <!doctype html><html><head><meta charset="utf-8"><title></title> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">  <link rel="stylesheet" href="../style/weui.css"/>  <link rel="stylesheet" href="../style/weui2.css"/>  <link rel="stylesheet" href="../style/weui3.css"/>      <script src="../zepto.min.js"></script>      <script>  $(function(){$('.weui-menu-inner').click(function () {    var $menu = $(this).find('ul'),        height = $menu.find('li').length * 40 + 15 + 'px',        opacity = $menu.css('opacity');    $('.weui-menu-inner ul').css({        'top': '0',        'opacity': '0'    });    if(opacity == 0) {        $menu.css({            'top': '-' + height,            'opacity': 1        });    }else {        $menu.css({            'top': 0,            'opacity': 0        });    }});	  	  });                </script></head><body ontouchstart style="background-color: #f8f8f8;">    <section class="weui-menu">        <div class="weui-menu-inner">            <em></em>            <span>内测</span>            <ul>                <em></em>                <li>微信</li>                <li>QQ</li>                <li>陌陌</li><li>陌陌陌陌陌陌</li>            </ul>        </div>        <div class="weui-menu-inner">            <em></em>            <span>公测</span>            <ul>                <em></em>                <li>淘宝</li>                <li>支付宝</li>                <li>天猫</li><li>陌陌陌陌陌陌</li><li>陌陌陌陌陌陌</li><li>陌陌陌陌陌陌</li><li>陌陌陌陌陌陌</li>            </ul>        </div>        <div class="weui-menu-inner">            <em></em>            <span>上线测试</span>            <ul>                <em></em>                <li>百度地图</li>                <li>百度一下</li>                <li>百度智能</li>            </ul>        </div>                    </section></body></html>
 |