可排序插件,使用拖放过渡对图像进行排序

时间:2018-05-28 22:41:03

标签: jquery-ui-sortable

我正在尝试对图像列表进行排序 - 允许按原样拖放图像。 使用下面的代码,我看到dom元素在我尝试拖放时被重新排序,但是,实际的拖放是不可见的,这是一个非常激烈的体验。 你能告诉我这里缺少什么吗?

<html>
<head>
<style>
li {
  display: inline-block;
}
img{
margin:10px;
}
</style>
</head>
<body>
<div>
  <ul class="sort-photos">
    <li><img src="http://via.placeholder.com/50x100" /></li>
    <li><img src="http://via.placeholder.com/60x100" /></li>
    <li><img src="http://via.placeholder.com/70x100" /></li>
    <li><img src="http://via.placeholder.com/80x100" /></li>
    <li><img src="http://via.placeholder.com/90x100" /></li>
  </ul>
</div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-sortable/0.9.13/jquery-sortable-min.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
        $(".sort-photos").sortable();
        });
    </script>
</body>
</html>

https://jsfiddle.net/unodurga/tn8kuzab/

0 个答案:

没有答案