<!DOCTYPE html>
<html>
<style>
#div1 {
font-size:48px;
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<body>
<div id="div1" class="fa"></div>
<script>
function smile() {
var a;
a = document.getElementById("div1");
a.innerHTML = "";
setTimeout(function () {
a.innerHTML = "";
}, ۱۰۰۰);
setTimeout(function () {
a.innerHTML = "";
}, ۲۰۰۰);
setTimeout(function () {
a.innerHTML = "";
}, ۳۰۰۰);
}
smile();
setInterval(smile, 4000);
</script>
<p>This example demonstrates how to use an icon library to make an animated effect.</p>
</body>
</html>
تصویر به سه حالت زیر به طور متحرک تغییر شکل انجام میدهد.
همچنین می توانید از تصاویر متحرک دیگر نیز استفاده کنید. کافی است کد مربوط به هر یک را جای گذاری کنید.
در این لینک می توانید نمونه کدهای تصاویر متحرک را مشاهده کنید.