Question

我在html页面中有以下布局：

+-------------------------------------+
|                          | Reload   |
| dynamic graph image div  +----------+
|                                     |
|                                     |
|                                     |
|                                     |
+-------------------------------------+

动态图形图像div将通过jquery POST方法从另一个php页面获取图形，并且将有一个重新加载按钮（Reload），它应该在动态div上。每次查询时都会更改此动态图表。按下此重新加载链接后，将通过jquery代码再次获取此动态div的图像/图形。通过这种方式，用户无需重新加载整个页面。

但是如何放置重新加载链接以使其位于图像/图形的顶部？

Answer 1

简单的CSS：

.container_div {
    position:relative;
}
.container_content{
    position:relative;
    z-index:999;
}
.floating_button{
    position:absoltue;
    top:0;
    right:0;
    z-index:1000;
}

使用一些示例html：

<div class="contianer_div">
    <div class="container_content">
        Your content here
    </div>
    <div class="floating_button">
        button content
    </div>
</div>

应该做的伎俩;

进一步阅读：http://www.w3schools.com/css/css_positioning.asp

Answer 2

HTML：

<div id="dynamic">
    <a id="button">reload</a>
<div>

CSS：

#dynamic{
   position: relative;
}

#button{
   position: absolute;
   top: 0;
   right: 0;
}

Answer 3

这是一个CSS问题而不是jquery问题。

尝试这样的事情：

<div class="container">
    <img class="image" src="image.png"/>
    <a class="reload" href="#">Reload</a>
</div>


.container 
{
   position:relative;
   width:100%;
}

.image
{
    position:absolute;
    top:0;
    left:0;
    z-index:1;

}

.reload
{
    position:absolute;
    top:0;
    right:0;
    z-index:2;
    display:block;
    width:30%;
}

如何创建浮动重装按钮

3 个答案: