<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>
