0

ブートストラップの流動的なレイアウトでjquery UIのソート可能なリストを使用しています。すべて問題ありませんが、move イベントでは、一部の "li" が約 10 ピクセルずれます。理解を深めるためにデモをご覧ください。 http://jsfiddle.net/6UkdR/3/

<div class="row-fluid">
    <ul id="sortable">
        <li class="ui-state-default span3">
            ....
        </li>
        ....
    </ul>
</div>
#sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
}
#sortable .ui-state-default {
    min-height: 350px;
}
.row-fluid [class*="span"]:nth-child(5n) {
    margin-left: 0;
}
.ui-sortable-placeholder {
    margin-left: 0 !important;
}
$("#sortable").sortable({
    cursor: 'move',
    scroll: 'false',
    opacity: 0.9
}).disableSelection();
4

2 に答える 2

0

<li>タグ " " 間のすべてのスペースを削除します

<div class="row-fluid">
        <ul id="sortable">
            <li class="ui-state-default span3">
                ....
            </li><!-- Remove space
    --><li class="ui-state-default span3">
                ....
            </li><!-- Remove space
    --><li class="ui-state-default span3">
                ....
            </li>
        </ul>

そしてli {overflow:hidden;}にスタイルを追加します

またはデモ用にスタイルを追加

span.span3{overflow: hidden;float:none!important;display:inline-block!important;margin-left:0!important;margin-right:1.5%;}

于 2016-12-18T17:07:02.297 に答える