我正在开发一个 HTML/CSS/JavaScript 应用程序,并且我有一个功能,用户可以单击多个图像选项(不同大小),然后单击“开始!” 应用程序将使用 JavaScript 将图像叠加在一起(按顺序使最大的图像在底部,依此类推)。我环顾四周,我看到的大多数网站都建议使用 CSS position:absolute
,但我想知道是否有另一种使用 JavaScript 的方法来做到这一点,所以它更具交互性。
有什么建议么?我是 JavaScript 的初学者,很抱歉问了一个初级问题。
我正在开发一个 HTML/CSS/JavaScript 应用程序,并且我有一个功能,用户可以单击多个图像选项(不同大小),然后单击“开始!” 应用程序将使用 JavaScript 将图像叠加在一起(按顺序使最大的图像在底部,依此类推)。我环顾四周,我看到的大多数网站都建议使用 CSS position:absolute
,但我想知道是否有另一种使用 JavaScript 的方法来做到这一点,所以它更具交互性。
有什么建议么?我是 JavaScript 的初学者,很抱歉问了一个初级问题。
您可以使用 JavaScript 来操纵图像的位置。为每个图像分配一个 id 并使用 JavaScriptgetElementById
更改位置。
所以像:
<div id="image1"><img src="image1.png" /></div>
然后是你的 JavaScript:
document.getElementById("image1").style.position = "absolute";
document.getElementById("image1").style.left = "0px";
document.getElementById("image1").style.top = "30px";
您可以对多个图像执行此操作,只需为每个图像 div 分配一个唯一的 id。