Изменение положения Div при нажатии

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

У меня есть четыре Div один за другим внутри основного div и выровнены по вертикали.

Нравится:

 DIV1
DIV2
DIV3
DIV4

Я хочу, чтобы при нажатии на любой из DIV, div, на который нажат, находится сверху, а другой скользит вниз. Как я могу это сделать с помощью jQuery?

Например.

Если был нажат DIV3, divs переупорядочивают себя следующим образом:

 DIV3
DIV1
DIV2
DIV4

Любая помощь приветствуется.

Ответ №1:

Вот вертикальная анимированная версия, которая относительно расположена и довольно гибкая.

http://jsfiddle.net/bryanjamesross/RgGyF/

Ответ №2:

Вы можете использовать

 $('divSelector').click(function()  
{  
    $(this).parent().prepend(this);  
});

1. Вместо того, чтобы прикреплять отдельный обработчик событий к каждому div с помощью click, это была бы идеальная ситуация для использования делегирования событий. Просто используйте . делегируйте(), чтобы прикрепить один обработчик событий к контейнеру, который содержит div s, вместо того, чтобы использовать .click() для добавления обработчика событий к каждому div.

Ответ №3:

Если вам не нужна анимация, вы можете перемещать элементы DOM с помощью этого:http://jsfiddle.net/japanick/jx945 /

Если вам нужна анимация, вы можете абсолютно точно расположить элементы и переместить их, используя атрибут CSS top в jQuery.animate().