1

JQuery Tools Scrollableを使用して、全ページ幅のスクロール可能なフォームを作成しています。フォームの各ページがページ全体をスクロールし、右からスライドする次のページに置き換えられます。

私が抱えている問題は、ブラウザのサイズ変更とブラウザ内ズーム(Ctrl +/-)の中で、各ページが中央に配置されるようにする方法です。私のコードは以下に基づいています:http://flowplayer.org/tools/demos/scrollable/site-navigation.html

私は自分のコードを次のようなdivに入れてみました:

<div style="margin-left:-440px; padding-left:50%; width:50%; min-width:880px;">

ただし、このdiv自体はページの中央に配置されているため、スクロールするページは左端までスライドしません。divの端で左から約30%離れて切り取られ、見栄えが悪くなります。

私が考えることができる唯一の結論は、div class = "items"で定義したマージン左を動的に変更して、常に50%-440pxに等しいが0以上になるようにすることです。

javascriptを使用してこれを行うにはどうすればよいですか?

4

1 に答える 1

0

コンテナはdiv絶対位置ですか、それとも相対位置ですか?特定の幅がある場合、たとえば「800px」の場合、左右に自動マージンを設定すると、水平方向の中央揃えが簡単になりmargin: 0 autoます。そうでなければ、それはトリッキーになります。

Javascriptでサイズ変更に応答したい場合は、jqueryで$(window).resize(function() {})ここのドキュメント)のようなことを行い、ハンドラー関数内でCSSの値を更新します。幅を増やしたいが自動マージンが残っている場合は、を選択しdivて幅プロパティを更新できます$('.mydiv').css('width', '900px');。これは、ウィンドウのサイズが変更されるたびに発生します。

于 2010-10-11T03:52:09.550 に答える