#jquery #jquery-ui
#jquery #jquery-пользовательский интерфейс
Вопрос:
Я хочу встряхнуть div «#error_message». Я делаю:
$('#error_message').effect('shake', {times: 2, distance: 5}, 200);
Div встряхивается, проблема в том, что div ниже перемещается вертикально, как бы перемещается на 10 пикселей вниз во время выполнения анимации, затем он возвращается обратно в свое положение. К нему не подключено другое событие JS, а «#error_message» — это div (то есть это блок).
Извините, на данный момент я не могу показать html и JS. Есть какие-либо подсказки, почему это может происходить?
Комментарии:
1. ну, приведенный ниже div перемещается, потому что error_message нуждается в пространстве для перемещения, не так ли? вы могли бы попробовать поиграть с css-позицией error_message div и z-индексом, чтобы он располагался на другом слое, отличном от его текущих аналогов
2. error_message перемещается только по горизонтали, поэтому, насколько я понимаю, не должно быть никаких других divs, перемещающихся по вертикали
Ответ №1:
Хорошо, это происходит потому, что вашему errors div требуется место для «встряхивания», поэтому то, что вам нужно сделать, это исключить этот div из потока остального вашего контента, который следует за ним.
Если ваш div с ошибками имеет фиксированную высоту, вы можете сделать что-то вроде этого:
<div id="wrapper">
<div id="error_message>Error content</div>
<div id="content">rest of your content, other divs etc</div>
</div>
CSS:
#wrapper {
position: relative;
}
#error_message {
position: absolute;
width: 300px;
height: 100px;
}
#content {
margin-top; 100px;
position: relative;
}
Действительно сложно отлаживать что-то подобное, потому что вы не предоставили код. Возможно, вы можете создать небольшой образец вашей разметки и CSS на http://jsfiddle.net?
Комментарии:
1. Я обновил свой ответ приблизительным решением, но в основном вы должны опубликовать свой код.
2. Спасибо, я понял проблему и исправил ее, следуя вашему шаблону. Извините, в следующий раз я опубликую пример 🙂