脚本宝典收集整理的这篇文章主要介绍了1.基本拖拽，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>拖拽</title> 8 <style type="text/css"> 9 html, body { 10 height: 100%; 11 background-color: pink; 12 margin: 0; 13 } 14 ul { 15 list-style-type: none; 16 padding: 0; 17 } 18 ul > li { 19 padding: 10px 0; 20 background-color: white; 21 margin-bottom: 2px; 22 /* border-bottom: 1px solid #444444; */ 23 } 24 .blue-background-class { 25 background-color: skyblue; 26 } 27 </style> 28 </head> 29 <body> 30 <ul id="itxst"> 31 <li>item1</li> 32 <li>item2</li> 33 <li>item3</li> 34 <li>item4</li> 35 <li>item5</li> 36 <li>item6</li> 37 <li>item7</li> 38 </ul> 39 40 <script src="https://cdn.bootcdn.net/ajax/libs/Sortable/1.14.0/Sortable.min.js"></script> 41 <script type="text/javascript"> 42 43 const el = document.getElementById('itxst') 44 45 new Sortable(el, { 46 animation: 150, // 单位是毫秒(ms)，在排序移动时的动画速度，"0" 表示没有动画 47 ghostClass: 'blue-background-class', // 在拖动时赋予了拖动列表组件类名 48 }) 49 50 51 </script> 52 </body> 53 </html>
以上是脚本宝典为你收集整理的1.基本拖拽全部内容，希望文章能够帮你解决1.基本拖拽所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。