3

jQuery Mobileのポップアップのサイズは、左側と右側に15ピクセルの余白、上下に30ピクセルの余白があるように制限されています。コンテンツがこれらの制約に対して大きすぎる場合、ポップアップは長くなります(幅が広くなりません)。そのため、ポップアップコンテンツを表示するには、ページ全体をスクロールする必要があります。

ポップアップのサイズがウィンドウの高さを超えないように、またコンテンツがポップアップ内で垂直方向にスクロールするように、この動作を変更する必要があります。

このようにポップアップのサイズを制限することが可能です:

$('#popup').on({
  popupbeforeposition: function() {
    var maxHeight = $(window).height() - 30
    $('#popup').css('max-height', maxHeight + 'px')
  }
})

...ただし、ポップアップコンテンツは同じであり、ポップアップ内のコンテンツではなく、ポップアップの下部を通過し、ユーザーにページをスクロールするように強制します。

ポップアップコンテンツをポップアップ内で垂直方向にスクロールできるようにするにはどうすればよいですか?

ポップアップコンテンツがウィンドウの下部を通過します

4

1 に答える 1

7

以下を使用する必要があります。

$('#popup').css('overflow-y', 'scroll');    

これが実際の例です:http://jsfiddle.net/Gajotres/mmRnq/

最終的な注意事項

jQuery Mobile ページとウィジェットをカスタマイズする方法について詳しく知りたい場合は、この記事をご覧ください。jQuery Mobile に !important が必要な理由など、多くの実用的な例が付属しています。

于 2013-02-06T13:19:27.813 に答える