2011-08-12 21 views
0

以前にAndroidアプリで使用するために開発されたWebアプリケーションがいくつかあり、iOSに移植しようとしています。iScrollを使用したiOSでのWebアプリケーションのスクロール

最初の問題は、私たちが持っていた広告がモバイルSafariではポジション:固定されていないためです。だから、私はiScrollをダウンロードした。

iScrollはRSSフィードリーダー(zRSSFeed for jQuery)でうまくいきません。実際、両方が同じページで有効になっていると、iScrollの機能は「機能します」が、ページの上部にはまってしまいます。

私はiScrollユーザーグループ(https://groups.google.com/group/iscroll/browse_thread/thread/5dd274ff4159a672)に投稿しましたが、役に立たない回答はありませんでした。

私はさらに別のRSSライブラリに変更しようとしましたが、すべてこの問題を引き出しているようです。

誰もこの問題を以前に持っていましたか?誰かがそれを解決しましたか?私はちょうどあきらめて、webappの底に広告を置くべきでしょうか?

ありがとうございました。

編集:私は少しのコードを追加する必要がありました。

ウェブスタッフの基本構造:

.... 
<div id="appBody"> 
    <div id="feedResults"> 
     <!-- rss entries go here --> 
    </div> 
</div> 
<div id="appAdvertisements"> 
    <!-- admob JS stuff goes here --> 
</div> 
.... 

基本JS:私はあなたが最初にあなたに解析RSSとこのアクションのonCompleteので#feedResultsを取り込むことをお勧め

var scroll; 
document.addEventListener('touchmove', function (e) { e.preventDefault();}, false); 
function loaded() { 
    scroll = new iScroll('appBody'); 
    $('#feedResults').rssfeed('<feedurl>', {<options>}, function() { scroll.refresh() }); 
} 
document.addEventListener('DOMContentLoaded', loaded, false); 

答えて

0

、あなたがiScrollを開始。 MatteoがiScroll4のドキュメントで述べたように、setTimeoutを使わずにrefreshと同時に使用しないでください。私はそれはそれであなたのRSSを持っているDOMに時間を与えるだろうし、その後iscrollが正しい高さを計算すると思い

var scroll; 
function loaded() { 
    $('#feedResults').rssfeed('<feedurl>', {<options>}, function() { 
     scroll = new iScroll('appBody'); 
    }); 
} 
document.addEventListener('touchmove', function (e) { e.preventDefault();}, false); 
document.addEventListener('DOMContentLoaded', loaded, false); 

:機能を考慮し

()onCompleteのためのスタンドの後、このような何かを試してみてくださいあなたのラッパー全体(この場合はappBody)の

0

まったく同じ問題がありました。私のための解決策は、位置を追加することでした:絶対;あなたのラッパーの中の要素に直接、あなたの場合はposition:absoluteを追加する必要があります。 feedResultsにフィードします。

0

HTML5ベースのアプリケーションでは、滑らかなスクロールは常に挑戦的です。スムーズなスクロールを実装するサードパーティのライブラリがありますが、実装は非常に複雑です。このスクロールライブラリでは、ユーザはscrollable = true属性をスクロール可能なディビジョンに追加するだけで、スムーズなネイティブスクロールのようにスクロールします。
1いいえ、手動でスクロールオブジェクトを作成する必要があります。

http://github.com/ashvin777/html5


メリットライブラリリンク

その上で作業を開始するために最初のReadme.docファイルをお読みください。
2スクロールバーでデータが変更された場合、Scrollerは自動的にリフレッシュされます。
3手動で更新する必要はありません。
4ネストされたスクロールコンテンツも可能で、デュアルスクロールの問題はありません。
5すべてのWebkitエンジンで動作します。
6ユーザーがそのスクローラオブジェクトにアクセスしたい場合は、 "SElement.scrollable_wrapper"を記述してアクセスできます。 scrollable_wrapperは、htmlページで定義されているスクロール可能な除算のIDです。

関連する問題