html代碼：
<body>
<h1>❤<span>+1</span></h1>
</body>css代碼：
h1{
font-size: 50px;
color: pink;
text-align: center;
position: relative;
}
span{
font-size: 25px;
font-weight: normal;
color: #333;
position: absolute;
top: 0;
left: 50%;
opacity: 0;
}
.active span{
-webkit-animation:flutter 1.2s ease-in-out;
animation:flutter 1.2s 1 ease-in-out;
}
@keyframes flutter{
0%{
opacity: 0;
}
100%{
opacity: 1;
top: -10px;
left: 53%;
}
}js代碼：
$("h1").on("click",function(){
if(!$(this).is(".active")){
$(this).addClass("active");
}
})點擊過後效果圖如下：
