Search jQuery

jQuery Forum

in Using jQuery UI • 5 years ago

hi,

[my first post btw..:) ]

My html looks like this

</div>

my js code is like this

What i actualy want to do?

1. all divs should be draggable and resizable

2. divs with class .tab should be sortable aslo

Seems like straight forward thing but i just cant manage to make everithing work together

if i make mainContainer sortable i cannot resize it and vice versa....

Help please!?

Replies(3)

5 years ago

Something like…

<!DOCTYPE html>
<html>
<head>
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function(){
$('#mainContainer').sortable()
$('.tab').resizable();
})
</script>
<style>
.tab
{
border: 1px solid red;
width: 400px;
}
</style>
</head>
<body>
<div id="mainContainer">
<div class="tab">tabl 1</div>
<div class="tab">tabl 2</div>
<div class="tab">tabl 3</div>
</div>
</body>
</html>