1

现在我挣扎了几天，我找到了一个似乎不起作用的解决方案。

无论如何，我要做的是在有人拖动宽度小于 1000 像素的窗口时“锁定”屏幕。我的意思是，水平滚动条必须出现，背景图像必须停止调整大小，文本停止移动。当达到低于 1000 像素以及文本时，背景必须变为可水平滚动。

希望有人可以帮助我，现在尝试了两天：s

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Hup</title>


<style type="text/css">
html{

    background: url(jup.png) no-repeat center center fixed;
    min-width:500px;
    max-height: 500px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size:auto 580px;
    background-position: center 120px;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='jup.png',     sizingMethod='scale');
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='jup.png', sizingMethod='scale');
}

#menu {
    position:absolute;
    margin-top:80px;
    margin-left:20px;
    position:absolute;
right:20px;
}
.menu_container {
    width:500px;
    overflow:hidden;
    position:absolute;
    display:none;
    height:100px;
}
#bottom {
    position:absolute;
    margin-top:720px;
    position:absolute;
    left:20px;
    white-space: nowrap;
}
.bottom_container {
    width:500px;
    overflow:hidden;
    position:absolute;
    display:none;
    height:100px;

}
body,td,th {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;

}
body {
    min-width:1024px;
    background-color: #000;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
</style>
</head>

<body>

<div id="menu">
<div class="container">
Text here
</div>

</div>
<div id="bottom">
<div class="container">
Text here
</div>

</div>

</body>
</html>
4

1 回答 1

2

简单的：

body { min-width: 1000px; }
于 2013-03-18T20:15:36.300 回答