Question

我遇到一些问题需要将Loaded-Content 图片保留在某个位置：已修复。

我的容器通过单击按钮加载隐藏的内容，转换加载的内容应从右向左滑动。它应始终位于顶部。

加载内容<div class="sticky">cat image</div>应始终固定在顶部。任何帮助将不胜感激。

<html>
<div class="container">many photos</div>
<button>LOADED-CONTENT comes in transform(translateX(0%)</button>
</html>

<html>
sticky image always on top.
<button>back button slides the loaded content transform(translateX(100%)</button>
</html>

http://jsfiddle.net/6kpnN/

Answer 1

添加CSS和specity，使div类始终位于顶部

<style>
.sticky
 {
  position: fixed;   
  top : 0px;
  left : 0px;
  width : (specify) ;
  height : (specity here);
  }
 </style>

Answer 2

你可以用css

来做

#IdName{
position: fixed;
top: 0px;
}

JSFIDDLE

你可以学习css here

Answer 3

在实际使用CSS之前，您应该始终了解有关CSS的更多信息。

在这种情况下，将使用一些属性：

width
top
left（或right）
position

整个代码是这样的：

.selector {
    position: fixed;
    top: 0;
    left: 0; /* Or right:0; */
    width: 100%; /* Or change it if you want */
}

将.selector更改为您需要的selector。

使用position:fixed修正页面中的位置指定top使得从页面顶部到元素的距离始终为0 指定left / right也会确定左/右与元素之间的距离最后，指定width会在页面顶部显示一个栏。

在您提出问题之前，请务必先搜索：Search

如何在固定位置的页面顶部显示div？

3 个答案: