1

我的网页有问题。我在可滚动的图像顶部放置了一个按钮，<div></div>它位于表格<div></div>的内部<td></td>。图片顶部的按钮具有以下 CSS 样式：

border:none; 
background-color:transparent;
color:#FFF;
z-index:101;
top:2px;
background-image:url(count.png);
background-size:40px;
width:40px;
height:40px;
padding:0 15px;
font-size:16px;
margin-left:-5px;
cursor:pointer;
position:absolute;

现在的问题是当我向下滚动时，按钮保持在同一位置。我想要的是当我向下滚动按钮时，按钮与图像一起隐藏在同一位置。我怎样才能做到这一点？任何帮助将不胜感激。

jsFiddle：jsFiddle

4

1 回答 1

2

The issue that you might be facing is something like positioning. You are position the image position: relative to the div, Not the image. If you wrap the image in a div and then set the position then it will go up too.

However, that is only the issue, try using something like:

<div class="image-div>
  <img src="src_to_file.png" alt="photo" />
  <button class="button">Button</button>
</div>

You can use this as the css:

.image-div {
position: relative;
}
.button {
position: absolute;
}

Also make sure that .image-div is not the main or parent div, as if it is! The button will float over it, but if the div .image-div is the child, it will slide (scroll).

于 2013-09-10T16:07:27.583 回答