HTML CSS如何设置100%的高度,扩展时的宽度为100%,但当宽度变窄时,它不显示全宽

时间:2014-07-21 06:42:32

标签: html css

我不确定如何实现我想做的事情。很难完全描述我的意思,但我有一个例子。

情况 当屏幕水平展开时,图像被设置为屏幕宽度的100%,但是当图像缩小时,它不会完全显示图像,而是保持高度100%。

我在下面附上了一个例子,这正是我的想法。

http://www.therentscene.com/

     <script>
   var container=window;
         var image=document.getElementById("backimage")
         if (container.height() > container.width()) {
    image.css({height: container.height(), width: ''});
} else {
    image.css({height: '', width: container.width()});
}



  </script>

1 个答案:

答案 0 :(得分:0)

使用js / jQuery并找到max(container.h, container.w)并将该值应用于图像本身

if (container.height() > container.width()) {
    image.css({height: container.height(), width: ''});
} else {
    image.css({height: '', width: container.width()});
}