android - 将 iScroll 与 Jquery Mobile 一起使用。

Question

我有一个使用 html5 和 Jquery Mobile 创建的简单对话框。如下：

<div data-role="dialog" id="page2" data-theme="a">

            <div data-role="header" class="header">

                <h1>Door Styles</h1>

            </div><!-- /header -->

            <div data-role="content" data-theme="a">


            <div id="wrapper">

                <div id="scroller" class="scroll">  

                    <ul data-role="listview" id="mylist">

                    </ul>

                    </div>

                </div>

            </div><!-- /content -->

            <div data-role="footer" class="footermodal">

                <h1>↕ Please Scroll ↕&lt;/h1>

            </div><!-- /footer -->

        </div>

我实现 iScroll 的原因是因为在 Android 2.2.2 中对话框不可滚动。但是，当我实现它时，它几乎将我的页眉和页脚移出屏幕。当你滚动时，只要你放开它，它就会弹回顶部。我使用以下代码实现它：

    <script type="text/javascript">

var myScroll;
function loaded() {
    myScroll = new iScroll('wrapper');
}

    window.addEventListener('load', setTimeout(function () { loaded(); }, 200), false); 

            </script>

这似乎是 Jquery 样式和 iScroll 样式之间的冲突。有没有其他人有这个问题？或者知道如何解决？

Answer 1

您需要在创建元素后安装它。

newElement =  function () {$ ("body"). append ('<div id='wrapper'> content </ div> ");loaded(); }

Answer 2

#wrapper { position: absolute; top: 0px; bottom: 0px; }

我刚刚遇到了这个问题并修复了它，确保你的包装 div 的位置是绝对的或固定的，并且定义了顶部和底部。