好资源导航 » 文章资讯 » vue 左滑删除功能的示例代码

vue 左滑删除功能的示例代码

2023-08-29 14:27:04 55

最近有个需求是要添加一个左滑删除的功能。参考了一下别的老哥的代码,做了一点点改进。记录一下。以备不时之需,话不多说，上代码


.slider-item{
width:100%;
height:60px;
border-bottom:1pxsolid#eeeeee;
overflow:hidden;
display:flex;
position:relative;

.content{
min-width:100%;
height:100%;
background:yellow;
box-sizing:normal-box;
padding-right:60px;
position:relative;
transition-property:all;
transition-duration:0.4s;
transition-timing-function:cubic-bezier(0,0.85,0.72,0.86);
transition-delay:0s;

.remove{
position:absolute;
top:0;
right:0;
width:60px;
height:60px;
background:#fe5ba8;
text-align:center;
line-height:60px;
font-size:15px;
color:#ffffff;
}
}
}

参考实例

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

vue 左滑删除功能的示例代码

热门推荐

随机推荐