Поднятие div блока по клику, к месту клика
Есть например 4 дива:
<div>ссылка1</div> <div>ссылка2</div> <div>ссылка3</div> <div>Поднимающийся див</div> нужно при нажатии на ссылку 4-ый див поднимался до нажатой ссылки например если нажать на ссылку1 будет так: <div>ссылка1</div> <div>Поднимающийся блок</div> <div>ссылка2</div> <div>ссылка3</div> |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(function() {
$('div.link').click(function() {
$('#box').insertAfter(this)
})
});
</script>
</head>
<body>
<div class="link">ссылка1</div>
<div class="link">ссылка2</div>
<div class="link">ссылка3</div>
<div id="box">Поднимающийся див</div>
</body>
</html>
|
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div class="link">ссылка1</div>
<div class="link">ссылка2</div>
<div class="link">ссылка3</div>
<div class="block">Поднимающийся див</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(".link").click(function(){
$(".block").appendTo($(this));
});
</script>
</body>
</html>
|
j0hnik,
есть принципиальные отличия в данном случае? |
Цитата:
|
Цитата:
|
Цитата:
https://jsperf.com/appendto-insertafter |
Цитата:
PS. И не $('.link'), а $('div.link'), тоже для скорости. ;) |
Цитата:
|
Цитата:
|
| Часовой пояс GMT +3, время: 01:47. |