Задать вопрос
Roman_Romanov
@Roman_Romanov
symfony
javascript

Как поймать перетаскиваемые элементы и упорядочить их?

<script>
	$(document).ready(function() {
		$( ".draggable" ).draggable({
			helper: "clone",
			revert: "invalid",
		}).css({"width":"106%"});
		$( "#droppable" ).droppable({
			activeClass: "ui-widget-header",
			drop: function( event, ui ) {
				var clone = ui.draggable.clone();
				clone.css({ "margin-top":"3px", "margin-bottom":"10px", "width":"180px", "margin-left":"45px", 
				"float":"left", "clear":"left"});
				clone.find( ".draggable" ).css({"margin-top":"3px", "margin-bottom":"50px"})
				clone.find( ".clear_coment" ).css({"margin-right":"", "margin-top":" "
				, "display":"block"});
				clone.find('.clear_coment').click(function(event) {
					var index=$('.clear_coment').index(this);
					$('div[class^="draggable"]').eq(index).remove();
					$(this).remove();
				});		
				$("#droppable").append(clone);
			}
		});
		$('.dropdown li').on('click', function(event) {		
			$(".hideit").hide();
			$("#" + event.target.id +"_z").show();
		});
  });
	</script>	
	</head>
<body>
<div class="newClass">	
	<div  id="draggable" class="ui-state-highlight">
		<img src="img/1.jpg" width="140px" height="140px" > 
		Какое то описание <h1>стоимость: 2к </h1>
	</div>
	<div  id="draggable1" class="ui-state-highlight1">
		<img src="img/2.jpg" width="140px" height="140px" > Какое то описание
	</div>
</div>	
	<div id="droppable" class="ui-widget-header"  >		
	</div>
<script src="app/js/main.js"></script>
</body>
</html>
  • Вопрос задан
  • 225 просмотров
1 комментарий
Подписаться 2 Оценить 1 комментарий
Помогут разобраться в теме Все курсы
  • Нетология
    Веб-разработчик с нуля: профессия с выбором специализации
    14 месяцев
    Далее
  • Академия Эдюсон
    Fullstack-разработчик на JavaScript + ИИ
    11 месяцев
    Далее
  • ProductStar × РБК
    Профессия: Инженер по тестированию + ИИ
    6 месяцев
    Далее
Пригласить эксперта
Ответы на вопрос 1
@seriogja
Добрый день!
Из кучи приведенного кода и пары слов описания ничего не ясно. Но подозреваю, что вам нужно это.
P.S. Хотите чтобы вам помогли как можно быстрее, разместите код на jsfiddle например. Где будет видно, что работает, что не работает, а в вопросе подробнее распишите, чего вы все-таки хотите.
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы