Jquery 当大小更改时，使div中的元素保持相同
我有下面的代码，用来创建一个类似笔记本的开口Jquery 当大小更改时，使div中的元素保持相同,jquery,html,css,Jquery,Html,Css,我有下面的代码，用来创建一个类似笔记本的开口 <html> <style> #container { position:absolute; width:570px; height:360px; } inner { height:360px; position: relative; float:left; width:570
<html>
<style>
#container
{
position:absolute;
width:570px;
height:360px;
}
inner
{
height:360px;
position: relative;
float:left;
width:570px;
}
#div1
{
background-color:red;
overflow:hidden;
height:360px;
position: relative;
float:left;
width:570px;
}
#div2
{
background-color:yellow;
overflow:hidden;
height:360px;
position: relative;
float:left;
width:0px;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
var flipped = false;
function flip() {
if (flipped==false)
{
$("#div2").animate({
width: '570px'
}, { duration: 2000, queue: false });
$("#div1").animate({
width: '0px'
}, { duration: 2000, queue: false });
flipped=true;
}
else
{
$("#div2").animate({
width: '0px'
}, { duration: 2000, queue: false });
$("#div1").animate({
width: '570px'
}, { duration: 2000, queue: false });
flipped=false;
}
}
</script>
<body>
<input type="button" onClick="flip()" value="flip">
<div id="container">
<div id="div1">
<label>Some field:</label><input type="text">
</div>
<div id="div2">
<label>Some other field:</label><input type="text">
</div>
</div>
</body>
#容器
{
位置：绝对位置；
宽度：570px；
高度：360px；
}
内部的
{
高度：360px；
位置：相对位置；
浮动：左；
宽度：570px；
}
#第一组
{
背景色：红色；
溢出：隐藏；
高度：360px；
位置：相对位置；
浮动：左；
宽度：570px；
}
#第二组
{
背景颜色：黄色；
溢出：隐藏；
高度：360px；
位置：相对位置；
浮动：左；
宽度：0px；
}
var翻转=错误；
函数翻转（）{
如果（翻转==错误）
{
$（“#div2”）。设置动画({
宽度：“570px”
}，{持续时间：2000，队列：false}）；
$（“#div1”）。设置动画({
宽度：“0px”
}，{持续时间：2000，队列：false}）；
翻转=正确；
}
其他的
{
$（“#div2”）。设置动画({
宽度：“0px”
}，{持续时间：2000，队列：false}）；
$（“#div1”）。设置动画({
宽度：“570px”
}，{持续时间：2000，队列：false}）；
翻转=错误；
}
}
某些领域：
其他一些领域：
谢谢，使用
空白：nowrap