[英]HTML positioning of divs above image
I have a large image, and a bunch of divs that I'm using as fake buttons on top of said image. 我有一个很大的图像,并且在该图像顶部有一堆用作伪按钮的div。 Currently, I'm using absolute positioning to place the divs where I want them to be, but I've got a lot of divs, and finding the x/y coords by trial and error is time I don't want to take.
目前,我正在使用绝对定位将div放置在我想要的位置,但是我有很多div,通过试验和错误找到x / y坐标是我不想花费的时间。 Is there an easier way to position them, or am I stuck?
有没有更简单的方法放置它们,还是我被卡住了?
I'm using jQuery and Javascript in this project, so these can be used for solutions. 我在此项目中使用jQuery和Javascript,因此可以将它们用作解决方案。
CSS: CSS:
#test0 {
position:absolute;
left:381px;
bottom:100px;
}
HTML: HTML:
<div id="image">
<div id="test0" class="button" onclick="$('#modal').dialog('open');" style="postion:absolute">
Click me to test Modal!
</div>
<div id="test1" class="button" onclick="$('#modal').dialog('open');" style="postion:absolute">
Click me to test the same Modal!
</div>
<img src="testImage.jpg" alt="testtest" />
</div>
HTML: HTML:
<div id="image">
<div id="container-of-fake-divs">
<div class="fake-div">FAKE DIV</div>
<div class="fake-div">FAKE DIV</div>
</div>
<img src="image.jpg" />
</div>
STYLE: 样式:
#image { position:relative; }
#container-of-fake-divs { position:absolute; top:0; left:0; }
.fake-div { display:block; }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.