伙计们，我想将 div 的宽度和高度固定为 100%。但问题是 div 在一个固定宽度的包装器中。
我在 div 上方有一个按钮，它 onclick=""使 div 以全宽和全高更改其类。我想将该 div 定位到窗口的左上角。我的代码是
<html>
<head>
<title>Javascript Change CSS Class of Div tag</title>
<style type="text/css">
#wrapper
{
width:75%;
height:75%;
margin:0 auto;
}
.minimize {
color : red;
width:500px;
height:200px;
background:#474747;
float:left;
}
.maximize {
color : blue;
width:100%;
height:100%;
float:left;
background:#ccc;
}
</style>
<script language="javascript" type="text/javascript">
function changeCssClass(navlink)
{
if(document.getElementById(navlink).className=='minimize')
{
document.getElementById(navlink).className = 'maximize';
}
else
{
document.getElementById(navlink).className = 'minimize';
}
}
</script>
</head>
<body> <div id="wrapper">
<div id="navlink" class="minimize"><input type="button" value="click here" onclick="changeCssClass('navlink')" /> </div>
</div>
</body>
</html>
但我想用包装器让它看起来像这样
<html>
<head>
<title>Javascript Change CSS Class of Div tag</title>
<style type="text/css">
.minimize {
color : red;
width:500px;
height:200px;
background:#474747;
float:left;
}
.maximize {
color : blue;
width:100%;
height:100%;
float:left;
background:#ccc;
}
</style>
<script language="javascript" type="text/javascript">
function changeCssClass(navlink)
{
if(document.getElementById(navlink).className=='minimize')
{
document.getElementById(navlink).className = 'maximize';
}
else
{
document.getElementById(navlink).className = 'minimize';
}
}
</script>
</head>
<body>
<div id="navlink" class="minimize"><input type="button" value="click here" onclick="changeCssClass('navlink')" /> </div>
</body>
</html>
有人会在这里帮忙....
如果有人有什么建议？？
最佳答案
我认为这就是您所追求的，但很难说清楚，因为您没有明确指定 .minimize 和 .maximize 应保持哪些状态。
请注意，javascript 与您原来的有很大不同。
由于“类”是 DOM 元素的属性，因此应使用 getAttribute 和 setAttribute 访问它。 IE6 中有一个非常非常古老的错误，它只会让 javascript 通过 className 访问元素的类，但现在不再是这样了。
此外，请注意我是如何处理类属性的。由于您可以在一个元素上指定多个类，因此此代码会考虑到这一点。您可以安全地添加更多类，而不必担心最大化和最小化。
第二个要看的是CSS。无论滚动值是多少，使用 position:fixed 都会将元素锁定到位。在本例中，有两种方法可以将 div 设置为全屏。第一个是将宽度和高度指定为 100%。然而，这是脆弱的。
最好将 top、right、bottom 和 left 设置为 0。这会给您更多的控制权。另外，假设您希望边缘周围有一个薄边距。不必担心将顶部和左侧与宽度和高度混合在一起，您只需为我提到的 4 个属性指定一个像素或百分比值即可获得简单、统一的外观。
关于javascript - 固定在窗口顶部的div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12793980/