博主信息
拾一枝櫻花的博客
博文
6
粉絲
0
評論
1
訪問量
2024
積分:0
P豆:14

vue實現右側劃入

2019年11月20日 15:46:29閱讀數:112博客 / 拾一枝櫻花的博客 / vue

Html

  1. 點擊觸發的html
  2. <div @click="silderMask"></div>
  3. 滑動層中的html
  4. <transition name="slide-fade">
  5. <div v-show="isShow"></div>
  6. </transition>

Css

  1. .slide-fade-enter,.slide-fade-leave-to {
  2. transform: translateX(100%); -webkit-transform: translateX(100%);
  3. }
  4. .slide-fade-enter-active,.slide-fade-leave-active {
  5. will-change: transform; transition: all 0.3s ease;
  6. }

Js

  1. var vm = new Vue({
  2. data:{
  3. isSubordinate: false,
  4. isBoss: false
  5. },
  6. mounted:function(){
  7. },
  8. methods: {
  9. silderMask: function () {
  10. this.isShow = true
  11. }
  12. }}).$mount('#nev');

全部評論

文明上網理性發言,請遵守新聞評論服務協議

條評論
暫無評論暫無評論!
  • 足彩吧合买平台