Всех друзей поздравляем с Новым годом! Всего вам самого наилучшего! Всех благ, здоровья а материальное приложится!
СКРИПТЫ althtmlcssphpjsblog

Перемещение блока jquery

Поддержи проект!!! smile

Для иллюстрации перемещения блока нам понадобится какой-то блок. В котором, например выберем какой-то элемент, его выделим в красный цвет, чтобы его было видно! К примеру этот элемент будет строчкой номер 2…

1.

<ul class="list l1">

<li class="start no1"> Первая строка </li>

<li class="start red"> Вторая строка </li>

<li class="start no3"> Третья строка </li>

</ul>

<ul class="list l2">

<li class="start no1_1"> Первая строка второго блока </li>

<li class="start no2"> Вторая строка второго блока </li>

<li class="start no3"> Третья строка второго блока </li>

</ul>

В данном случае jquery перемещение работает таким образом: мы должны выделить какой-то элемент$(".l1 .red") , который будем перемещать –
И уже его долины поместить в конструкцию поставить после… $(".l2 .no2").before()

И соберем все вместе:

<script>$(".l2 .no2").before($(".l1 .red"));</script> </div>

Результат:

  • Первая строка
  • Вторая строка
  • Третья строка
  • Первая строка второго блока
  • Вторая строка второго блока
  • Третья строка второго блока
2.

Если вам требуется переместить объект, код, не до, а после выбранного объекта то вам нужно использовать метод after

<ul class="list l3">

<li class="start no1"> Первая строка </li>

<li class="start red"> Вторая строка </li>

<li class="start no3"> Третья строка </li>

</ul>

<ul class="list l4">

<li class="start no1_1"> Первая строка второго блока </li>

<li class="start no2"> Вторая строка второго блока </li>

<li class="start no3"> Третья строка второго блока </li>

</ul>

<script>$(".l4 .no2").after($(".l3 .red"));</script>

Результат:

  • Первая строка
  • Вторая строка
  • Третья строка
  • Первая строка второго блока
  • Вторая строка второго блока
  • Третья строка второго блока

Вас может еще заинтересовать список тем : #JS | #JS_JQUERY |
Последняя дата редактирования : 2020-01-24 04:23
Название скрипта :Перемещение блока jquery
Скрипт № 47.8Ссылка на скачивание : Все скрипты на одной странице
//dwweb.ru/comments_1_5/include/img/hand_no_foto.png
no
no
Еще никто не прокомментировал! COMMENTS+   BBcode
аватар
🞨
Загрузить свой аватар
(max ширина, высота = 200px)

Подписаться + =
Теги:
Перемещение блока jquery

Последние комментарии :
Марат :
19/01/2021 01:13
Всегда пожалуйста!Приходите ещё!
подробнее.
аркадий :
19/01/2021 01:08
Спасибо!Меню вернулось. Класс!
подробнее.
Прохожий :
02/01/2021 10:44
Здравствуйте Марат!Спасибо Вам, за оперативность и развернутый ответ с примерами. И ОГРОМНОЕ спасибо, что…
подробнее.
Марат :
01/01/2021 03:30
И вас с Новым годом!Посмотрите …
подробнее.
Прохожий :
31/12/2020 03:58
А как проверить, чекнут ли чекбокс программно, то есть - другим скриптом, а не мышкой?Вот тут…
подробнее.