鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ vue-router 頁面加轉(zhuǎn)場動畫 路由消失問題

vue-router 頁面加轉(zhuǎn)場動畫 路由消失問題

切換路由加的動畫
app.vue中的代碼

.trans-enter{
  transform: translateX(100%);
}
.trans-enter-active{
  transition: 1s linear;
}
.trans-leave-active{
  transform: translateX(-100%);
  transition: 1s linear;
}

就是在右側(cè)像左側(cè)滑動這樣子 結(jié)果 動畫滑動時路由消失是怎么回事呢
router-view加的定位樣式 也是不起作用 z-index那個也試了也不行

 position: absolute;
  top: 0;
  left:0;
  bottom: .85rem;

路由切換卡高85px

回答
編輯回答
安于心

動畫類寫錯了

 .pg-enter{
    transform: translate(-100%);
  }
  .pg-enter-active,
  .pg-leave-active{
    position: absolute;
    top: 0;
    width: 100%;
    transition: all .5s;
  }
  .pg-leave-to{
    transform: translate(100%);
  }
2017年2月24日 09:03
編輯回答
愚念

問題已解決 meta標簽沒加入 maximum-scale=1.0, minimum-scale=1.0, user-scalable=no 跟最小縮放minimum-scale=1.0這個有關(guān)

2017年1月13日 02:56