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" 上定义的 margin-left 以确保它始终等于 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 回答