我正在使用html5-css-Jsmobile进行phonegap项目...我正在使用多页模板... 我正在尝试使用Iscroll来实现某些文本视图的滚动...当我在FF上测试它时,只有当我刷新页面时才有效...第一次加载页面时它不起作用... on iOs设备它不起作用...滚动弹跳到顶部并且不向下滚动...我尝试在网络上找到一些不同的解决方案...我试图将#ss 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&autohide=1&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;
}
答案 0 :(得分:4)
尝试在超时时初始化iScroll
setTimeout(function () {
myScroll = new iScroll('wrapper');
}, 100);
如此处所述 - ONLOAD部分中的http://cubiq.org/iscroll-4