0

我有一个 div（或文章或部分..），其中显示了页面的主要内容。（包括：文本、图像、段落等）。

我想要的是：我希望图像顶部位于该 div 的底部。但：

如果 DIV 的高度大于浏览器窗口的高度，我希望此图像位于用户始终可见的位置视口底部。

如果 DIV 的高度比浏览器窗口的视口短，那么我希望此图像位于 DIV 底端所在的任何位置。

前任。1- DIV比视口长，所以底部图像固定在视口底部

图像用 -> ... 表示

==================
=   ______       =
=  |      |      =
=  | DIV  |      = 
=  |      |      =  --> VIEWPORT FRAME
=  |      |      =
=  |...   |      =
==================
   |      |      
   |      |      
   |------|

前任。2- DIV比视口短，所以底图固定在DIV的底部

图像用 -> ... 表示

==================
=   ______       =
=  |      |      =
=  | DIV  |      = 
=  |...   |      =
=  |------|      =
=                =
==================

当然，我可以使用 JavaScript 来实现这一点。但我想知道这是否可以通过使用额外的层 DIV 或包装器或其他类型的 CSS 定位来实现。]

如果 CSS-HTML 方式不可行，那么最好的 JS 逻辑是什么？

1）页面加载：比较高度并相应地定位图像，如果滚动完成重新计算和重新定位？

谢谢你。

4

1 回答 1

1

不要引用我的话，因为我不是 100% 确定的，但也许你可以使用 JQuery 动态地将 DIV 的定位从相对更改为绝对。

我在想，如果它不在视野范围内

position: absolute;
bottom: 0px;

别的

position: relative;
bottom:0px;

这样绝对位置会将其固定在页面底部，否则相对定位会将其固定在其父 div 的底部。

如果您创建一个小提琴，我（或其他任何人）可以为您玩这个。

希望有帮助！

于 2012-05-08T15:15:39.667 回答