<div class="drawer">
<div class="setbox" :class="{show: isshow}">
<div class="header">
<p class="fl">标题</p>
<button class="off" @click="close">关闭</button>
</div>
</div>
</div>
close() {
this.isshow = false;
},
open() {
this.isshow = true;
},
.drawer {
.setbox {
position: fixed;
z-index: 1000;
top: 0px;
bottom: 0px;
width: 350px;
height: 100%;
background: gray;
border-left: 1px solid #cfd8dc !important;
box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
right: -460px;
padding: 0px 0px 0px 20px;
}
.show {
right: 0;
}
}
vue实现抽屉功能 点击其他地方不消失 动画实现
最新推荐文章于 2023-08-21 14:54:56 发布