我添加了一些悬停过渡到我的wordpress网站,我已经结合了hvr-icon-forward和hvr-fade类来自
hover.css,在悬停网站上我将这些类合并到了检查器中,它起了作用,但由于某种原因在我的网站上得到一个白色背景闪光然后显示正确的背景颜色见
gif
任何帮助,将不胜感激.
任何帮助,将不胜感激.
HTML:
<div id="home_cta"> <a class="hvr-fade hvr-icon-forward" href="#">Building</a> <a class="hvr-fade hvr-icon-forward" href="#">Plumbing & Heating</a> <a class="hvr-fade hvr-icon-forward" href="#">Self Build</a> </div>
SCSS
#home_cta a { background-color: #0619BF; margin-bottom: 10px; width: 50%; padding: 16px; color: white; font-weight: bold; } #home_cta .hvr-fade { background-color: #0619BF; } #home_cta .hvr-fade:hover { background: #0000f5; background: -webkit-linear-gradient(legacy-direction(to right),#0000f5 0%,#0000c3 100%); background: linear-gradient(to right,#0000c3 100%); }
解决方法
你有这个闪光灯,因为在背景颜色上应用了过渡,并且在css中也应用了css渐变.
你需要在css中重写如下:
.hvr-fade { transition-property: color; }
这是工作Fiddle.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。