javascript根据窗口大小扩展div和bg图像

时间:2013-03-11 21:12:28

标签: javascript css html

对不起,第一个问题。我通过反复试验来学习这一切。无论如何,我无法弄清楚如何复制这个1脚本。

我想要做的是使用javascript或somthing根据窗口的大小在div中扩展div和bg图像。有关我想要做的示例,请查看42floors

我的项目已合成

/* header */

/* I want to expand dynamically */
<div>

/*Content area with title showing at bottom like example site, even when window is expanded. */
<div>

/* footer */

任何见解或方向都会非常有帮助。感谢。

3 个答案:

答案 0 :(得分:1)

看看他们的源代码。他们使用以下内容:

#container {
  width: 100%;
  background: url(your-image.png);
  background-size: 100%;
}

请注意,IE6-8不支持background-size

答案 1 :(得分:0)

http://johnpatrickgiven.com/jquery/background-resize/如果你没有提供关于IE&lt; 9

答案 2 :(得分:0)

一个相当简单的编程方法是向窗口调整大小事件添加一个事件监听器并计算高度/宽度并适当调整image / div的大小。

$(document).ready(function(){
    $(window).resize(function(){
        //change the size of your div using something like
        $(div).css("width", value);
        $(div).css("height", value);
    });
});

顺便使用Jquery。 http://code.jquery.com/jquery-1.9.1.min.js