heartAnimation

功能描述

按钮点击爆炸特效，用例参见 heartAnimation.html

依赖的模块

./heartAnimation.css

快速使用

首先引入css文件

<link rel="stylesheet" type="text/css" href="heartAnimation.css" />

在需要使用的地方加上以下代码

<div class="heart" id="like"></div>

然后加个点击事件，就可以实现效果

<script>
    document.getElementById('like').onclick = function() {
        this.style.backgroundPosition = "";
        if(this.getAttribute('class').indexOf('heartAnimation') > -1) {
            this.classList.remove("heartAnimation");
            this.style.backgroundPosition = 'left';
        } else {
            this.classList.add("heartAnimation");
        }
    }
</script>