0

我目前有一个运行全屏画布元素的 HTML 页面。在这个画布元素中，我绘制了各种填满页面的东西。随着页面大小的调整，绘制的内容也会调整大小以填满屏幕。但是，一旦达到某个最小尺寸，绘制的东西就不再调整，而是在页面中添加溢出滚动条。

现在，我正在尝试在画布上添加一个新元素，该元素永久固定到相对于画布右下角的位置。postion:absolute;在画布重新缩放时，给 div 一个 CSS 样式可以正常工作。但是，一旦页面越过最小尺寸并且画布不再重新缩放，而是出现滚动条，新的 div 就会随着可视窗口继续移动，而不是停留在它应该相对于画布的位置。一旦大小足够小，我就尝试过使用postion:fixed;（用 jquery 替换 css），但这似乎也不起作用。

有人有什么建议吗？

最好的，
萨米

4

1 回答 1

2

将画布包含在容器 div 中

<div class="canvas_container">
    <canvas></canvas>
    <div class="positioned_element"></div>
</div>

在你的 CSS 中

.canvas_container{position:relative;}
.positioned_element{position:absolute;bottom:0;right:0;}

这将使定位元素转到父“.canvas_container”的右侧/底部，而不是站点的主体。

于 2012-04-12T00:12:33.147 回答