1

我正在使用 html5-css-Jsmobile 进行 phonegap 项目...我正在使用多页模板...我正在尝试使用 Iscroll 来实现某些文本视图的滚动...当我在 FF 上对其进行测试时它可以工作仅当我刷新页面时...第一次加载页面时它不起作用...在 iOs 设备上它不起作用...滚动反弹到顶部并且不会向下滚动...我尝试了一些在网上找到的不同解决方案...我尝试将 css hight 添加到 #scroller>#wrapper...尝试使用 iscroll-lite ...

在某些页面中，我有多个滚动...我找到的唯一解决方案是添加 var myScroll2、var myScroll3 等等...

帮我 ;）

我的代码：

<script type="text/javascript">

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

        }

        document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);


        document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);


        </script>

带有滚动条的 HTML DIV DATA-ROLE PAGE（我有一些其他类似的带有滚动条的页面） 

    <div data-role="page" id="missione_archeologica" class="pag_video" data-iscroll="enable">
        <div data-role="content" style="top:0px;">

            <iframe width="100%" height="auto" src="http://www.youtube.com/embed/H-uLyp0z3Dg?rel=0;3&amp;autohide=1&amp;showinfo=0"  frameborder="0" allowfullscreen style="color:transparent; height:182px; position:absolute;"></iframe>
            <script type="text/javascript">
                if(navigator.onLine!==true)
                document.getElementsByTagName('iframe')[0].outerHTML='<img src="images/menu/no_conn.png" style="width:100%; height:182px; position:absolute;">';
                </script>

            <div class="titVideo"><img src="images/cultura/menu/missione.png" /></div>
            <div id="wrapper">
                <div id="scroller">
                    <p>Nel 1877 l'esploratore e geografo Renzo Manzoni, nipote del celebre scrittore di Fermo e Lucia, si reca nello Yemen dove soggiorna tre anni, in particolare a San'a, e scrive El Yèmen. Tre anni nell'Arabia Felice, pubblicato nel 1884. Manzoni racconta le sue impressioni di viaggio, con precise descrizioni degli ambienti, corredati da disegni e fotografie.....
                    </p>
                </div></div>


            <div data-role="footer" data-position="fixed" id="footer">
                <a href="#menu" id="HomeL" data-role="button" data-transition="fade"></a>
                <a href="#cultura_menu" id="p_cultura" class="p_tab" data-role="button" data-transition="fade"></a>
            </div>

        </div>
    </div>
    </div>
    <!--*********  MISSIONE ARCHEOLOGICA *************-->

CSS

#wrapper {
position:absolute; z-index:1;
top:221px; bottom:48px; left:0;
width:100%;
overflow:auto;
height:206px;
color:#FFF;
text-shadow:none;
font-family:"Interstate-Regular";
font-size: 13px;
}



#scroller {
position:absolute; z-index:1;
-webkit-tap-highlight-color:rgba(0,0,0,0);
width:100%;
padding:0;
}

#scroller p {
padding:0px 12px 0px 12px;

}
4

1 回答 1

3

尝试像这样在超时中初始化 iScroll

setTimeout(function () {
        myScroll = new iScroll('wrapper');
    }, 100);

如此处所述 - ONLOAD 部分中的http://cubiq.org/iscroll-4

于 2013-05-03T18:01:53.437 回答