使用MUI 实现模仿QQ向左滑动出现删除,编辑的代码

<!DOCTYPE html
>
<
html
lang=
"en"
>
<
head
>
<
meta
charset=
"UTF-8"
>
<
meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<
meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<
title
>Document
</
title
>
<
link
rel=
"stylesheet"
href=
"./mui/css/mui.css"
>
</
head
>
<
style
>
/* 使出现的错误隐藏[Intervention] Unable to preventDefault inside passive event listener due to target being treated as */
html,body{
touch-action:
none;
}
ul li a{
font-size:
14px
!important;
}
<
/
style
>
<
body
>
<
div
>
<
ul
id=
"OA_task_2"
class=
"mui-table-view"
>
<
li
class=
"mui-table-view-cell"
>
<
div
class=
"mui-slider-right mui-disabled"
>
<
a
class=
"mui-btn mui-btn-grey mui-icon"
>编辑
</
a
>
<
a
class=
"mui-btn mui-btn-yellow mui-icon"
>删除
</
a
>
</
div
>
<
div
class=
"mui-slider-handle"
>
<
div
class=
"mui-table-cell"
>
左滑显示多功能菜单
</
div
>
</
div
>
</
li
>
</
ul
>
</
div
>
</
body
>
<
script
src=
"./mui/js/mui.js"
></
script
>
</
html
>

版权声明:本文为weixin_41905935原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
THE END
< <上一篇
下一篇>>