mui 区域滚动

来源：互联网发布：阿里云域名过户步骤编辑：程序博客网时间：2024/06/07 09:29
我在实际使用中，这样代码虽然能用，但是有些地方他还没有讲明白，如果贸然添加这样的一个区块代码，不一定能实现滚动效果。
<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />    <title></title>    <script src="js/mui.min.js"></script>    <link href="css/mui.min.css" rel="stylesheet" /></head><body>    <header class="mui-bar mui-bar-nav">        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>        <h1 class="mui-title">区域滚动例子</h1>    </header>        <div class="mui-content">        <div id="scroll1" class="mui-scroll-wrapper" style="top: 50px; bottom: 50px;">            <!--MUI默认是position是absolute-->            <div class="mui-scroll">                             <ul class="mui-table-view">                    <li class="mui-table-view-cell">                        第一个选项卡子项-1                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-2                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-3                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-4                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-5                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-6                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-7                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-8                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-9                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-10                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-11                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-12                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-13                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-14                    </li>                    <li class="mui-table-view-cell">                        第一个选项卡子项-15                    </li>                </ul>            </div>        </div>    </div>   <script type="text/javascript" src="js/jquery-1.6.1.min.js" ></script>    <script type="text/javascript">             $(function(){       $('#scroll').scroll({                indicators: true //是否显示滚动条            });                mui('.mui-scroll-wrapper').scroll({                deceleration: 0.0006 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006            });              })                    </script></body></html>
1 0