带排序功能瀑布流 masonry 特效代码

<!--  在页面中引入sortable.min.css和sortable.min.js文件。 -->

<link rel="stylesheet" href="path/to/sortable.min.css">

<script src="path/to/sortable.min.js"></script>

<!-- 1st step -->

<ul>

  <li>

    <a data-sjslink="food"> [...] </a>

  </li>

  <li>

    <a data-sjslink="development"> [...] </a>

  </li>

</ul>

<!-- 3st step -->

<div id="sortable" class="sjs-default">

  <!-- 2nd step -->

  <div data-sjsel="food"> [...] </div>

  <div data-sjsel="development"> [...] </div>

  <div data-sjsel="development"> [...] </div>

</div>

<!-- 最后，在页面DOM元素加载完毕之后，通过sortablejs()方法来初始化插件。 -->

<script type="text/javascript">

  document.querySelector('#sortable').sortablejs()

</script>