web-dev-qa-db-ja.com

jQuerymobileはページコンテンツの垂直スクロールを無効にします

Jquery mobileで垂直コンテンツスクロールを無効にするにはどうすればよいですか?ページコンテンツのすべてのスクロールを無効にしたい。ありがとう。


Jquery.mobileページを作成し、コンテンツにjquery.mobile.scrollviewを追加します。 scrollviewを使用すると、ページコンテンツが上下にスクロールします。スクロールコンテンツを無効にするにはどうすればよいですか?私のページコード:

<div id="page2" data-role="page" align="center">
    <div data-role="content">
        <div id="mydatacontent" class="form">
            <div class="data-table-shadow" data-scroll="y" class="square single-block-view-v" style="height: 750px;">
               <table id="datatable" class="data-table">
                   <tbody id="datatableContent">
                       <!-- Table Data Here -->
                   </tbody>
               </table>
           </div>
        </div>
    </div>
</div>
9
MaeSTRo

上記の答えはうまく機能していることがわかりました。ただし、これにより、「。ui-content」の子要素をスクロールできなくなります。私は

"scrollstart"

代わりにイベントを実行し、子要素は引き続きスクロール可能です。

$(document).delegate(".ui-content", "scrollstart", false);

IOS6Webビューでテスト済み。

14
PetiPablo

touchmoveイベントとreturn falseにバインドして、touchmoveイベントのデフォルトの動作を防ぐことができます。

$(document).delegate('.ui-content', 'touchmove', false);​

これにより、すべてのdata-role="content"要素のスクロールが無効になります。一部のページでのみこの機能が必要な場合は、.ui-contentセレクターをより具体的に更新できます。

これがあなたのモバイルデバイスで試すことができるデモです: http://jsfiddle.net/RKXLH/embedded/result/

13
Jasper

私の経験では、次のようにする必要があります。

var touchScroll = function( event ) {
    event.preventDefault();
};

$( 'element1').click(function() {
    //this will disable the scroll
    $( this).bind( 'touchmove', touchScroll );

    $( 'element2' ).click(function() {
        //this will enable scrolling
        $( document ).unbind( 'touchmove', touchScroll );
    });
}

element1とelement2は任意の関数にすることができます。もちろん、クリック関数は単なる例であり、任意の関数を選択できます。

6
dcdeiv