menu Chancel's blog
rss_feed
Chancel's blog
有善始者实繁,能克终者盖寡。

Amimate.css引起`z-index`异常失效的问题

作者:Chancel Yang, 创建:2021-06-15, 字数:520, 已阅:40, 最后更新:2024-03-10

这篇文章更新于 124 天前,文中部分信息可能失效,请自行甄别无效内容。

最近发现MDUI的弹出对话框模态化阴影盖住了弹出框,仔细查看发现是所有弹出框都有这个问题

去掉Amimate特效之后就没有这个问题,特效代码如下

HTML
<div v-bind:style="styleObject">
      <keep-alive>
        <router-view class="animated bounceInUp animate-css" v-if="$route.meta.keepAlive"></router-view>
      </keep-alive>
      <router-view  class="animated bounceInUp animate-css" v-if="!$route.meta.keepAlive"></router-view>
    </div>

检查后发现css类animatedanimation-fill-mode属性,将这个属性设置为none问题消失

故在app.vue添加修改

HTML
.animated{
  animation-fill-mode:none
}

[[replyMessage== null?"发表评论":"发表评论 @ " + replyMessage.m_author]]

account_circle
email
web_asset
textsms

评论列表([[messageResponse.total]])

还没有可以显示的留言...
gravatar
[[messageItem.m_author]] [[messageItem.m_author]]
[[messageItem.create_time]]
[[getEnviron(messageItem.m_environ)]]
[[subMessage.m_author]] [[subMessage.m_author]] @ [[subMessage.parent_message.m_author]] [[subMessage.parent_message.m_author]]
[[subMessage.create_time]]
[[getEnviron(messageItem.m_environ)]]