<分区>
通过这个脚本，我从我的浏览器窗口中获得了宽度和高度。对于这个尺寸，我想将 html 中的背景图像设置为 100%。 (无论屏幕尺寸如何)。其他元素(导航栏、文本、图片或 svg)必须调整到大小。
--> 我不想要滚动条，任何时候:)
window.onload = function ()
{
// initale Breite und Höhe des Browserfensters
var iWidth = window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth);
var iHeight = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
var bWin = document.getElementById('bWin');
bWin.innerHTML = "Fensterbreite " + iWidth + " <br />Fensterhöhe " + iHeight;
window.onresize = function (evt)
{
var width = window.innerWidth || (window.document.documentElement.clientWitdh || window.document.body.clientWidth);
var height = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
var bWin = document.getElementById('bWin');
bWin.innerHTML = "Aktuelle Breite " + width + " <br />Aktuelle Höhe " + height;
}
}
最佳答案
不是 100% 确定你在问什么，但我认为你正在尝试拉伸(stretch)你的背景图像以匹配你浏览器的宽度/高度......你要走的路看起来特别复杂，你为什么不尝试一些简单的 CSS
body,html { width: 100%; height 100%; }
body {
background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
/*ie8 Fix*/
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
zoom:1;
}
这适用于跨浏览器
要调整页面元素(div、navs 等)的大小，您需要查看css 媒体查询 和响应式设计(使用 % 作为宽度和高度) 如果您是响应式网站的新手，您可能应该在谷歌上搜索一些资料来阅读相关内容
响应式设计 CSS 与媒体查询的相似之处的快速示例
#container {
width: 900px;
margin: 0 auto;
}
@media (max-width: 900px) {
#container {
width: 100%;
}
}
关于javascript - 背景大小是 innerhtml 大小，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19838950/
相关文章：
javascript - 获取网页的所有按钮并在Javascript中删除具有特定背景图像的按钮
javascript - jquery滑动效果与div同时出现
javascript - MVC 5 中带有日期选择器图标的文本框
css 1、css 2、css 2.1 和 css 3，每个版本中哪些 css 属性和选择器不同/新增？
javascript - 获取动态插入的 HTML 以使用 knockoutjs
html - 创建一个三列导航菜单。在允许独立滚动的有效结构方面遇到麻烦