Основная реализация Dragula

Я пытаюсь получить простую реализацию Dragula, но она отказывается работать. Мой код:

<head>
<link href='drag3.css' rel='stylesheet' type='text/css' />
<link href='css/dragula.css' rel='stylesheet' type='text/css' />
<script src='drag3.js'></script>
</head>

<div class="container">
  <h1>Drag & Drop</h1>
  <p>Trying out <code>dragula.js</code>. Source <a href="https://github.com/bevacqua/dragula">here</a>.</p>
  <div class="left">
    <div id="drag-elements">
      <div>Element 1</div>
      <div>Element 2</div>
      <div>Element 3</div>
    </div>

    <div id="drop-target">
    </div>
  </div>
  <div class="right">
    <div id="display">Display</div>
  </div>
</div>

<script src='js/dragula.js'></script>
<script src='js/example.min.js'></script>

Не уверен, что я делаю не так, любая помощь будет с благодарностью получена!

Живой код здесь:

Реализация Драгула

2 ответа

Хорошо, поэтому я исправил это, просто перемещая

 <script src='drag3.js'></script>

до конца страницы.

Действительно :

Есть предостережение от драгулы. Вы не должны включать его в заголовок ваших веб-приложений. Помещать скрипты в голову - плохая практика, и поэтому dragula не прилагает никаких усилий для поддержки этого варианта использования. Вместо этого поместите в тело драгулу.

... согласно https://github.com/bevacqua/dragula

Другие вопросы по тегам