Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

有个hover悬停效果,想一进入页面模拟鼠标悬停让它显示效果,可以吗


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
1.5k views
Welcome To Ask or Share your Answers For Others

1 Answer

1、初始化时,添加hover的class;
2、鼠标划入后,删除hover的class;

<style>
    .app {
        width: 100px;
        height: 100px;
        background: antiquewhite;
    }
    .app.hover {
        background: aquamarine;
    }
    .app:hover {
        background: aquamarine;
    }
</style>

<div id="app" class="app hover">
</div>

<script>
  document.getElementById('app').onmouseenter = function () {
    this.className = 'app'
 }
</script>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...