div总是在页面顶部，随机图像自动适合该div

Question

请原谅我的无知，让我解释一下。

我希望div在网页中始终完全可见。 它是一个包含随机图片的div，之后是“Read more”按钮。因此，当页面完全向上滚动时，如果图像适合div并且div和按钮始终可见，那将是很好的。

所以，它的标题然后是“容器div”。在“容器div”中，最重要的是“阅读更多”div。不是position : fixed因为这在移动设备中不起作用。我想我必须做一些像

这样的事情

width : 50%
height : 
get the current height of the screen - height of the header = this is where it begins
get the current height of the screen - height of the footer - height of a text - height of a button = this is where it stops

但是我该怎么做？高度是屏幕尺寸的结果，并且基于百分率，因此它的响应式设计

此外，div包含一个随机图像，必须自动调整大小以适应并且不会被拉伸。

随意我的意思是它可能是“肖像形状”或者可能是“风景形状”。我读了这个article，但仅设置width:100%延伸“肖像形状”图像。

我该如何解决这个问题？

提前致谢

对不起我的英文。

Answer 1

对于固定位置，您可以使用此解决方案，如此处所示：What is the simplest jQuery way to have a 'position:fixed' (always at top) div?

$(window).scroll(function() {
  $('.headup').css('top', $(this).scrollTop() + "px");
});

对于图像，您可以使用max-width：

img {
   max-width: 100%;
}

http://jsfiddle.net/9sTXa/