0

我需要一个始终位于页面底部的 div，左边距为 172px，右边距为 383px。

这个 div 将有一些图像和文本以及左右按钮。例如，当您将鼠标悬停在右侧按钮上时，“不可见”的内容，在达到 div 的宽度限制后，将从右侧开始出现，向左侧滑动内容。

我尝试使用position:fixed; bottom:0px，但我无法设置 div 的边距，并且当屏幕尺寸发生变化时，它的宽度不会改变......

例如，这正是我想要的（底部的黑色 div）：

在此处输入图像描述

如果您知道任何可以执行我想要的 jquery 插件，或者您知道如何执行此类操作，请帮助我！

4

2 回答 2

2

如果您正在使用position: fixed，则无法应用边距。您可以指定leftandright属性。

position: fixed;
right: 383px;
bottom: 0;
left: 172px;

我知道这并不完全符合您的要求，但是您可以在该 div 上设置white-spaceandoverflow属性以使其显示水平滚动条。

white-space: nowrap;
overflow: auto;

用户将使用底部的滚动条来移动 div 的内容。这是一个例子：http: //jsfiddle.net/rustyjeans/5nv84/

要使用 jQuery 设置overflow: hidden并添加一些调整scrollLeftdiv 的函数，然后添加一些在悬停时调用这些函数的控件。这是一个例子：http: //jsfiddle.net/rustyjeans/FtSGn/

于 2012-10-24T22:37:14.240 回答
0

这不应该太难做到。您需要一个包含查看器尺寸的 div。然后，在其中有一个 div，绝对位置和尺寸超出查看器的宽度。当箭头悬停在使用 jquery 更改内部 div 的“左”css 属性时。那有帮助吗？

编辑：外部 div 应该有“位置：相对；” 以确保内部 div 相对于其边距定位。

于 2012-10-24T22:36:14.683 回答