我想知道如何从 a 的中间开始,当 Jquery 添加一个额外的 div 时,容器将中间作为起点。因此,第一个 div 从绝对放置的 div 的中间开始,当第二个 div 进入时,两个 div 都将中间作为起点。
所以我所拥有的是:
<div class="zoeken-absolute">
<div class="zoeken">
<form>
<div class="zoeken-select">
<div id="cat1" class="zoeken-value">Selecteer je school/opleiding</div>
<div class="zoeken-handle"></div>
<select class="gui-validate" id="school">
<option>Selecteer je school/opleiding</option>
<option value="656462">menu</option>
<option value="653688">HBO Spaans</option>
</select>
</div>
/////// This div below becomes visible when something is selected above ////////
<div class="zoeken-select course">
<div id="cat2" class="zoeken-value">Selecteer je sector/locatie</div>
<div class="zoeken-handle"></div>
<select class="gui-validate" id="course">
</select>
</div>
//////////////////////////////////////////////////////////////////////////////////
</form>
</div>
</div>
我的CSS:
#index .zoeken-absolute {
background: url("zoekenbg.png?") no-repeat scroll center top rgba(0, 0, 0, 0);
height: 220px;
left: 500px;
top: 75px;
width: 400px;
z-index: 999;
position:absolute;
}
.zoeken-select {
background: url("newsbg.png?") repeat-x scroll 0 0 #FFFFFF;
border: 1px solid #D7D7D7;
border-radius: 4px 4px 4px 4px;
box-shadow: 0 1px 0 #FAD689;
color: #000000;
font-size: 13px;
height: 26px;
line-height: 26px;
margin: 9px 0 0 10px;
position: relative;
width: 238px;
}
.zoeken-select .zoeken-value {
height: 26px;
left: 9px;
overflow: hidden;
position: absolute;
right: 25px;
text-shadow: 0 1px #FFFFFF;
white-space: nowrap;
}
.zoeken-select .zoeken-handle {
background: url("zoekdd.png") no-repeat scroll -3px 0 rgba(0, 0, 0, 0);
border-left: 1px solid #8D8D8D;
height: 26px;
position: absolute;
right: 0;
width: 25px;
}
.zoeken-select select {
cursor: pointer;
height: 100%;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
}
#index .zoeken > form {
margin-top:20px;
}