0

我想知道如何从 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;
}
4

0 回答 0