隐藏绝对定位div上的滚动条
我有一个定位为：绝对的 div，该 div 延伸到我的网站包装器的边界之外，因为它只包含滑块的背景图像，不需要一直看到。问题是我无法弄清楚如何阻止这个 div 触发滚动条。我尝试了溢出和位置的不同组合，但无法解决。
如果您使用 firebug 检查该元素，只需将其放在滑块后面的阴影上，您就会看到有问题的 div。您会注意到，一旦浏览器边界触及滚动条，滚动条就会启动。 查看链接
谁能告诉我如何停止出现阴影 div 的滚动条？
干杯 尼克
I have a div that is positioned:absolute, this div extends outside the bounds of my site wrapper as it just contains a background image for a slider and doesn't need to be seen all the time. The problem is I cannot work out how to stop this div triggering the scrollbar. I have tried different combinations of overflow and position and cannot work it out.
If you inspect the element with firebug, just place it over the shadow behind the slider and you will see the div in question. You notice the scrollbar kicks in as soon as the browser bounds touches it.
View link
Can anyone let me know how to stop the scrollbar appearing for the shadow div?
Cheers
Nik
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
它是 DIV 的大小。当我使用 Chrome 检查它时，CSS 显示容器 DIV 设置为 520px 宽度，有问题的 DIV 设置为 733px，因此它实际上超出了 980px 宽度的中心区域。除非你想让阴影消失，否则我建议将其向左移动一点，并使左侧的 div 变小。
您可以在 body 元素上使用 CSS Overflow-x:hidden。
我想到的其他更复杂的方法是使用 jQuery 来检测窗口的大小并根据窗口的大小调整有问题的 div 的大小。
It is the size of the DIV. When I inspect it using Chrome, the CSS shows that the container DIV was set to 520px width and the problematic DIV was set to 733px, so it actually exceeds the 980px width center area. Unless you want the shadow to disappear, I suggest moving it a bit to the left and make the div left to it smaller.
You can use the CSS overflow-x:hidden on the body element.
Other more complicated way that comes to mind is using jQuery to detect the size of the window and resize the problematic div according to the window's size.
首先，感谢那些评论的人。
我想出了一个解决方案，允许我保持布局相同，同时仍然遵守文档宽度。我所做的是在主包装器内创建一个 #wrap2，其宽度为 100%（浏览器窗口的全宽）。
这样做的技巧是确保图像位置设置为中心。这意味着在调整浏览器大小时图像也将保持相对于内容的关系。我在滑块后面制作阴影线的方法是在左侧添加空白像素，因此图像最终宽度约为 1200 像素，这将阴影部分推向右侧。因为都是空白像素，所以只增加了大约 1kb。如果有人认为有更好的解决方案，请告诉我。
Firstly, thanks to those that commented.
I have come up with a solution that allows me to keep the layout the same while still adhering to the document width. What I did was create a #wrap2 inside the main wrapper which has a width of 100% (full width of browser window).
The trick to this was making sure the image position was set to center. This means the image would also remain relative to the content when resizing the browser. The way I made the shadow line up behind the slider was to add blank pixels to the left, so the image ended up being about 1200px wide, this pushed shadow part right. Because it's all blank pixels it only added about 1kb. If someone thinks there is a better solution let me know.