Эффект jQuery вызывает перемещение элемента во время анимации
Когда я делаю анимационное шоу / скрыть на select
элемент он перемещает себя во время анимации. Я ничего не могу поделать со стилем "тела"; это стандартная разметка класса в приложении. Есть ли простой CSS, который я могу применить к select
элемент препятствует его перепозиционированию?
Обновление: добавлено третье select
элемент к коду и примеру
пример: http://jsfiddle.net/DSULq/8/
<div id="body" style="position: absolute; top: 100px;">
<div id="toolbar" style="background-color: grey; width: 400px;">
<select>
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
</select>
<select id="toggleMe">
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
</select>
<select>
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
</select>
</div>
<div>
<button>do effect</button>
$("button").click(function () {
if ($("#toggleMe").is(":visible")) {
$("#toggleMe").hide("slide", "slow");
} else {
$("#toggleMe").show("slide", "slow");
}
});
2 ответа
Решение
2013-05-17 17:32
Просто используйте фиксированную позицию для #toggleMe:
CSS:
#toggleMe {
position: fixed;
top: 100px;
left: 50px;
}