• 初始化

    初始化

    当DOM准备完成后iScroll需要被初始化。最保险的方式是在window的onload事件中启动它。在DOMContentLoaded事件中或者inline initialization中做也可以,需要记住的是脚本需要知道滚动区域的高度和宽度。如果你有一些图片在滚动区域导致不能立马获取区域的高度和宽度,iScroll的滚动尺寸有可能会错误。

    为滚动起容器增加position:relative或者absolute样式。这将解决大多数滚动器容器大小计算不正确的问题。

    综上所述,最小的iScroll配置如下:

    1. <head>
    2. ...
    3. <script type="text/javascript" src="iscroll.js"></script>
    4. <script type="text/javascript">
    5. var myScroll;
    6. function loaded() {
    7. myScroll = new IScroll('#wrapper');
    8. }
    9. </script>
    10. </head>
    11. ...
    12. <body onload="loaded()">
    13. <div id="wrapper">
    14. <ul>
    15. <li>...</li>
    16. <li>...</li>
    17. ...
    18. </ul>
    19. </div>
    20. </body>

    转到barebone example获取更多关于最小化 CSS/HTML结构的需求。

    如果你有一个复杂的DOM结构,最好在onload事件之后适当的延迟,再去初始化iScroll。最好给浏览器100或者200毫秒的间隙再去初始化iScroll。