1

見出しがすべてを物語っています。アプリの開始時に、php ファイル (いくつかの div) からデータを取得し、それらをラッパー div に追加します。このラッパー div (ラッパーとは呼ばれません) の周りには、iScroll ラッパーがあります。

iScroll は機能していますが、ラバーバンド効果があります。

（インデックス）HTMLは次のとおりです。

<div data-role="header" data-theme="c" data-position="fixed">
          <h1>Title</h1>
      </div><!-- /header -->

      <div id="wrapper">
          <div id="scroller">

      <div data-role="content" id="content">

         <div id="headlinesindex">


          <div class="span3" id="9999999999"></div>

        </div>
        </div>
       </div>

      </div>

      <script>
          $(document).ready(function() {
                            onBodyLoad();
                            });
          </script>

そして、ここにjavascriptファイルがあります：

    function onBodyLoad()
{
    $.ajax({
    url: "headlines_getter.php?last="+ $(".span3:last").attr('id') ,
    success: function(html) {
           if(html){    
            $("#headlinesindex").append(html);

           setTimeout(function () {
                      myScroll.refresh();
                      }, 0);

        }
    }
    });
}

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

iscroll.comsetTimeoutで説明されているように、いろいろ試しましたが、何も変わりません。

前もって感謝します。よろしく、ジョン。

4

4 に答える 4

2

同じ問題がありました。

これは、外側の「ラッパー」が iscroll で正しくサイズ設定されていないことが原因です。

内側の「スクローラー」の高さと同じサイズの場合、iscroll には移動先がなく、輪ゴムがありません。

私はそれを修正し、同じ問題を抱えている他の人のためにフォークを作成しました:

https://github.com/meckdahl/iscroll

================================== 高度な使い方

Spine.JS モバイル アプリで 20 以上のスクロール コンテナーを維持するために使用するアドオン関数を次に示します。

ページごとに、次のような特定のラッパーを設定します。

<div id="wrapper2">

次に、そのページがロードされている場合にのみ iScroll を動的に作成します。

ページのコンテンツが読み込まれた後、次のように呼び出します。

window.resetScroll(2)
window.setScrolling(true)

これにより、このページの iScroll が再初期化されます。

ルートページで定義する関数は次のとおりです。

<script type="text/javascript">

   // maximum wrapper index = 23 currently (9/12/12)
    var myScrolls = [];
    myScrolls.length = 29; // Scrolls to look for wrapper1-30

    var refreshScrolling = function() {
        //console.log('refreshScrolling Active Scroll Items: ');
        myScrolls.forEach( function(scrollItem){
            scrollItem.refresh();
        });
    };

   var refreshScroll = function(wrapperNumber) {
       //console.log('refreshScroll wrapperNumber: wrapper' + wrapperNumber.toString());

       var i = wrapperNumber;
       setTimeout(function () {
        (myScrolls[i-1]).refresh();
       }, 100);
   };

   // This looks for and initializes and dynamic scrolls that Spine recently put in memory
   // and have not been initialized yet.
    var setScrolling = function() {

       for (var i=1; i < myScrolls.length+1; i++){

           if (($("#wrapper"+(i).toString()).length !== 0)  ){

               if((myScrolls[i-1] !== null) && (myScrolls[i-1] !== undefined)){
                   // Already setup
               }
               else{
                   myScrolls[i-1] = new iScroll('wrapper'+ (i).toString(),
                           { hScroll: false, hScrollbar: false, vScrollbar: false });
 created.");
               }
           }
       }
    }

    // This must be called on a view with dynamic content to re-create the view to fit the potentially
    // changing content size.  It will only rebuild the one scroll whose index is passed in.
    // The index should be the wrapper# for the view attached to the controller.
    // Call setScrolling after this to catch any uninitialized views.
    var resetScroll = function(wrapperNumber) {


       var i = wrapperNumber;
       //   if (!(i in myScrolls)) continue; // skip nonexistent elements && !(myScrolls[i-1] )
       if (($("#wrapper"+(i).toString()).length !== 0)  ){

           if( (myScrolls[i-1] !== null) && (myScrolls[i-1] !== undefined)){
               // Destroy Skipped right now
               myScrolls[i-1].destroy();
               myScrolls[i-1] = null;
           }

           myScrolls[i-1] = new iScroll('wrapper'+ (i).toString(),
                   { hScroll: false, hScrollbar: false, vScrollbar: false });
           created.");
       }
    }

    function loaded() {
        setTimeout(function () {
            setScrolling();
        }, 100);
    }
    window.addEventListener('load', loaded, false);

</script>
于 2012-06-07T17:57:09.383 に答える
0

http://jsfiddle.net/Eccgy/

これがあなたを助けるかもしれないことを確認してください

于 2012-08-22T06:48:31.247 に答える
0

これが役立つ簡単な iscroller です。実装は非常に簡単です

include scripts と jsut 属性 data-iscroll を div に追加します。これには効果が必要です。

https://github.com/watusi/jquery-mobile-iscrollview

于 2013-05-24T09:25:51.773 に答える
0

カスタム スクリプトで同じ問題が発生したため、コードを変更したところ、問題なく動作するようになりました。

var myScroll;

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

そして、「onDeviceReady」で呼び出します。

function onDeviceReady()
{        
    loaded();
}
于 2012-05-23T06:08:52.187 に答える