dos

Application/Home/View/default/layout.tpl

@@ -122,6 +122,7 @@
     </script>
     </script>
     <script src="__CDN__/js/jquery-2.1.3.min.js"></script>
     <script src="__CDN__/js/jquery-2.1.3.min.js"></script>
     <script src="__CDN__/js/jquery-notify.min.js"></script>
     <script src="__CDN__/js/jquery-notify.min.js"></script>
+    <script src="__CDN__/js/sortable.min.js/"></script>
     {:block name='js'}{:/block}
     {:block name='js'}{:/block}
     <script>
     <script>
         window.wx && wx.ready(function () {
         window.wx && wx.ready(function () {

Public/static/css/index.css

@@ -193,6 +193,10 @@ input::-webkit-input-placeholder {
   border-bottom: 0.05rem solid #222222;
   border-bottom: 0.05rem solid #222222;
 }
 }
 
 
+.flag-sortable-active {
+  color: #c30101;
+}
+
 @keyframes trans {
 @keyframes trans {
   to {
   to {
     transform: translateY(0);
     transform: translateY(0);

Public/static/js/common.js

@@ -169,7 +169,19 @@ $(document).ready(function () {
         window.scroll(0, 0); //失焦后强制让页面归位
         window.scroll(0, 0); //失焦后强制让页面归位
     });
     });
     // $('.logo').css('top',getTranslateDistance(15));
     // $('.logo').css('top',getTranslateDistance(15));
-    //
+
+    $('.flag-list-content').attr('id', 'flag-list-content');
+    new Sortable(document.getElementById('flag-list-content'), {
+        animation: 150,
+        ghostClass: 'flag-sortable-active',
+        chosenClass: "flag-sortable-active",
+        delay: 100,
+        onChoose: function (event) {
+            console.log(event);
+
+        }
+    });
+
     $('.page1 .btn-next').on('click', showFlagPage);
     $('.page1 .btn-next').on('click', showFlagPage);
     //换一换按钮点击
     //换一换按钮点击
     $('.flag-page .btn-change').on('click', changeFlag);
     $('.flag-page .btn-change').on('click', changeFlag);