使用JavaScript（JQuery工具可滚动）中心更改CSS宽度

Question

我正在使用JQuery Tools Scrollable来构建全页宽度的可滚动表单，这样表单的每个页面都将一直滚动到整个页面，由从右侧滑入的下一页替换。

amidst browser resizing and in-browser zooming (Ctrl +/-). 我遇到的问题是如何使每个页面 ， 使其在浏览器调整大小和浏览器内缩放（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？

Answer 1

容器div绝对位置还是相对位置？ 如果它有特定的宽度，比如说“ 800px”，那么使用左右两侧的自动边距（例如margin: 0 auto ）很容易将其水平居中。 否则，它将变得更加棘手。

如果您想响应Java语言中的调整大小，请在jquery中执行$(window).resize(function() {}) （ docs此处 ）等操作，并且处理函数内部将更新CSS中的某些值。 如果您只想增加宽度但仍然具有自动边距，则可以选择div并更新width属性，例如$('.mydiv').css('width', '900px'); 。 调整窗口大小时都会触发。