2013-05-03 2 views
1

나는 html5-css-Jsmobile과 phonegap 프로젝트를하고있다 ... 나는 다중 페이지 템플릿을 사용하고있다 ... 나는 몇몇 텍스트 뷰를 위해 스크롤을 구현하기 위해 Iscroll을 사용하려고한다. FF로 테스트합니다. 페이지를 새로 고침 할 때만 작동합니다. 처음으로 페이지를로드하면 작동하지 않습니다 ... 작동하지 않는 장치 ... 스크롤이 위쪽으로 튀어 오르지 않습니다. 아래로 스크롤하지 ... 웹에서 찾은 몇 가지 differents 솔루션을 시도했다. #scroller> #wrapper에 css hight를 추가하려고 시도했다 ... iscroll-lite를 사용하려고 시도했다 ...IScroll 다시 반송

일부를 사용하려고 시도했다. 페이지에 여러 스크롤이 ... 내가 찾은 유일한 솔루션은 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-역할 페이지

<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

시도 (내가 몇 가지 다른 스크롤 유사한 페이지가) 타임 아웃에서 iScroll 초기화하기

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

여기에 명시된 바와 같이 -

+0

이 감사합니다 !!! ... 그것은 작동하는 온로드 섹션에 http://cubiq.org/iscroll-4) – Loralon