0
ピンクのパート1、パート2、パート3は私のカラムの見出しであり、その正確な固定位置。これどうやってするの ？私はキャンセルを使ってみましたが、どこに置くべきか分かりませんでした。jQuery - ソート可能なやりとりでdivが全く動かないようにするにはどうすればいいですか？
もしあなたが間違って書かれたものが見つかった場合は、私に言い訳をし、時間があれば通知してください。私はちょうど始めた、私は本当にこれで悪いです。
<html>
<head>
<script src="https://code.jquery.com/jquery-3.1.1.js" integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA=" crossorigin="anonymous"></script>
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>
<style>
html,
body {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
#main-container {
background-color: green;
width: 100%;
height: 100%;
margin: auto;
}
.column-div {
width: 300px;
height: 100%;
float: left;
margin-right: 10px;
}
.column-name {
width: 100%;
height: 30px;
text-align: center;
background-color: pink;
}
.user {
width: 100%;
height: 50px;
background-color: gray;
border: 2px solid yellow;
}
#aqua {
background-color: aqua;
}
#red {
background-color: red;
}
#orange {
background-color: orange;
}
</style>
</head>
<body>
<div id="main-container">
<div class="column-div" id="aqua">
<div class="column-name">
Part 1
</div>
<div class="user">
</div>
<div class="user">
</div>
<div class="user">
</div>
</div>
<div class="column-div" id="red">
<div class="column-name">
Part 2
</div>
</div>
<div class="column-div" id="orange">
<div class="column-name">
Part 3
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(".column-div").sortable({
connectWith: ".column-div"
}).disableSelection();
});
</script>
</body>
</html>
あなたは条件を試してみましたか？ – madalinivascu
好きなら、/その他？いいえ、私は持っていない、と私は実際にどのように私の現在の状況で1つをimplimentするための実際の考えがありません。 – Adi