2012-02-21 29 views
5

ページが読み込まれると、自動的に特定のdivにスクロールしたいと思います。しかし、私はJQMのスクロール機能といくつかの矛盾が生じているようです。このように包まれたときに正しくスクロールしないjQuery Mobile - ページ・ロードの特定のdivにスクロール

$.mobile.silentScroll($("#myElementId").offset().top); 

$('[data-role=page]').bind("pageshow", function() { 
    setTimeout(function(){$.mobile.silentScroll($("#myElementId").offset().top);},100); 
}); 

$('[data-role=page]').bind("pageshow", function() { 
    $.mobile.silentScroll($("#myElementId").offset().top); 
}); 

しかし、このような小さなタイムアウトで正しく動作

私は、次のコードを使用しています

コードの最後の部分の問題点は、ちらつきを引き起こし、 pを押して、ページを飛び降ります。どのようにこれを避けるためにどのようなアイデア?

答えて

2

setTimeoutは、以前に行ったページに戻って自分のスクロールが完了するのを待たなければならない場合に、スクロールした場所をjQuery Mobileフレームワークが記憶しているので機能します。あなたは、本質的に本当に大きなものにmobileinitイベントハンドラ内minScrollBackオプションを変更することで、この機能を無効にすることができますjQueryのモバイルフレームワークを使用すると、その後の訪問でページをご覧ないことを自動スクロールを無効にする必要があります

<script src="[jQuery Core]"></script> 
<script> 
$(document).bind("mobileinit", function(){ 
    $.mobile.minScrollBack = 90000; 
}); 
</script> 
<script src="[jQuery Mobile]"></script> 

ドキュメント:StackOverflowの上http://jquerymobile.com/demos/1.0.1/docs/api/globalconfig.html

+0

おかげさまでジャスパーですが、jQueryコアとJQMの間にコードを追加しても、それでも機能しません。 完全なページを更新した後でさえも起こるため、minScrollBackの問題ではないと思います。その時点で、JQMは以前にどこにスクロールされたのかを覚えてはいけません。 – Steve

2

最初の投稿!

これはありがとう、私はトランジションのためのカスタムアニメーションのかなりのビットを使用するプロジェクトに取り組んでいます、そして、ここに来るのに時間がかかりましたが、ジャスパーの答えは正しい方向に私を設定しました。ビットコード:

<script src="[jQuery]"></script> 
<script> 
$(document).bind("mobileinit", function(){ 
    $.extend($.mobile, { 
     minScrollBack: 90000 // turn off scrolling to position on last page 
    }); 
}); 
</script> 
<script src="[jQuery mobile]"></script> 

これはトリックを行うように見えました!

参考:http://jquerymobile.com/test/docs/api/globalconfig.html

0

君たちが今までの回答を試してみました?

$ .mobile.defaultHomeScrollを目的のスクロールに設定しない限り、動作しません。

つまり、2つのステップです。 1. $ .mobile.minScrollBackを十分大きな値に設定します。 2.ページの読み込み時にdefaultHomeScrollを目的の値に設定します。

これが機能します。

0

私はそれほど多くする必要はありませんでした...私はセクションで次のように作業しました。

<script>$(function() {$.mobile.defaultHomeScroll = $(window).scrollTop();});</script> 
関連する問題