vue拖动排序示例代码

代码语言:html

所属分类:拖放

代码描述:vue拖动排序示例代码

代码标签: vue 拖动 排序

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

   
<meta charset="UTF-8">




   
<style>

       
.list > div {
           
display: flex;
           
flex-direction: column;
       
}
       
       
.item {
         
width: 200px;
         
padding: 10px;
         
margin: 10px auto 10px 10px;
         
background: tomato;
         
color: white;
         
font-family: sans-serif;
         
border-radius: 5px;
         
display: inline-block;
       
/*   transition: opacity .3s ease-in-out; */
       
}
       
       
.flip-list-move {
         
transition: transform .2s;
       
}
       
       
       
.over {
         
opacity: .6;
       
}
       
       
.down {
       
/*   transform: translateY(-20px); */
       
}
       
       
.up {
       
/*    transform: translateY(20px); */
       
}
   
</style>



</head>

<body>
.........完整代码请登录后点击上方下载按钮下载查看

网友评论0