2012-02-20 83 views
1

在此網站上使用iScroll(http://cubiq.org/iscroll-4)(http://www.bigideaadv.com/adaptive/people.php)。iScroll ipad問題

我已安裝它,但它無法正常工作。下面的JS代碼:

<script type="text/javascript">  
    var myScroll; 
    function loaded() { 
     myScroll = new iScroll('ipad_container'); 
    } 

    document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false); 
    document.addEventListener('DOMContentLoaded', loaded, false); 
</script> 

倒塌的HTML結構:

<div id="ipad_container"> 
      <div id="scroller"> 
      </div> 
    </div> 
    <div id="bio_section"> 
    </div> 
    <div id="nav_section_people"> 
    </div> 

CSS太大,張貼在這裏。

當我嘗試滾動時,它會回到頂端位置。任何人有任何想法?

回答

1

你看過文檔嗎?

ONLOAD有時候DOMContentLoaded有點草率,當內容沒有準備好時會被解僱 。如果你陷入了一些奇怪的行爲 (如:橡皮筋效應),請嘗試以下操作:

<script type="application/javascript" src="iscroll.js"></script> 
<script type="text/javascript"> 
    var myScroll; 
    function loaded() { 
    setTimeout(function() {   
    myScroll = new iScroll('wrapper'); 
    }, 
100); } 
window.addEventListener('load', loaded, false); </script> 

在這種情況下iScroll開始只有100毫秒後的頁面 完全加載(圖形包括) 。這可能是最安全的 調用iScroll的方式。

來源:cubiq

+0

試過了。閱讀文檔和許多評論。 您在上面滾動的代碼滾動,但頁腳不會粘在底部。 – 2012-02-20 20:42:29

+0

我再次檢查了您的頁面,「橡皮筋」不再發生。還有問題嗎? – 2012-02-20 21:14:40

+0

我搞砸了代碼,橡皮圈又回來了,我想這意味着iscroll正在啓動。不知道它爲什麼會突然崩潰。 – 2012-02-21 19:07:38

0

我有完全相同的事情發生在我身上。我添加了參數'snap:true'並解決了問題。

所以,你行:

myScroll = new iScroll('ipad_container'); 

將成爲:

myScroll = new iScroll('ipad_container', {snap:true}); 

希望有所幫助。