Блог

Перетащите элемент из сортируемого списка и поместите его в блок, где элементы не сортируются, но перетаскиваются.

Кто-нибудь знает, как добиться этого эффекта в Jquery?

 <div id="viewpot">
    <div id="sortable">
        <div class="draggable">A</div>
        <div class="draggable">B</div>
        <div class="draggable">C</div>
        <div class="draggable">D</div>
    </div>
    <div id="dropArea">
    </div>
</div>
  

используйте перетаскиваемый пользовательский интерфейс jquery

Вы захотите сделать один список перетаскиваемым, а целевой сортируемым.

Разметка:

 <ul>
  <li id="draggable" class="ui-state-highlight">Drag me down</li>
</ul>

<ul id="sortable">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
  <li class="ui-state-default">Item 4</li>
  <li class="ui-state-default">Item 5</li>
</ul>
  

JavaScript:

   $(function() {
    $( "#sortable" ).sortable({
      revert: true
    });
    $( "#draggable" ).draggable({
      connectToSortable: "#sortable",
      helper: "clone",
      revert: "invalid"
    });
    $( "ul, li" ).disableSelection();
  });
  

Счастливого кодирования!