2017-02-03 31 views
0

Мой вопрос в том, как исправить этот странный сбой в jquery.Стоп этот странный jQuery Glitch

Когда я перемещаю один из ящиков, он заставляет все остальные коробки стрелять вниз, и я не уверен, почему это происходит. кто-нибудь знает, что вызывает эту проблему?

Это fiddle имеет все мой код на нем

The ЯШ:

$(document).ready(function(){ 
     $(function(){ 
      $('#container').sortable({ 
       connectWith: "#container", 
      cursor: "move" 
     }).disableSelection(); 
    }); 
}); 

HTML-

<div id="container"> 
    <div class="container-item">Item 1</div> 
    <div class="container-item">Item 2</div> 
    <div class="container-item">Item 3</div> 
</div> 

В CSS

lists { 
    height: 200px; 
    width: 300px; 
    border: 1px solid #000000; 
} 

#container { 
    background: lightgrey; 
    width:500px; 
    height: 50px; 
} 
.container-item { 
    display: inline-block; 
    width: 150px; 
    height: 500px; 
    background: lightblue; 
    margin-right: 10px; 
    margin-top: 0; 
    position: relative; 
    max-top: 50px; 
} 
+1

Что я вижу это поведение я ожидал увидеть ... – Tom

+1

У меня нет никаких проблем с кодом данного - какой браузер вы используете? –

+0

@thebluefox хорошо, что вы не очень помогаете с этим комментарием, я хочу остановить это поведение. –

ответ

5

Просто добавьте float: left - .container-item.

Fiddle example

+0

Сортировка, спасибо за простой ответ –

+3

... 'vertical-align: top' также будет работать. – Teemu