سلام امروز با آموزش فونت آیکون متحرک در خدمت شما هستم یه مدتی هست که با ورود فرمت SVG آیکون های متحرک و جالبی وارد وب شده و زیبایی و جلوه خیلی خاصی به صفحات وب میده این آیکون های زنده یا متحرک با استفاده از کتابخانه رافائل که یکی از زیر شاخه های جاوا اسکریپ هست طراحی شده اند شما میتونید با دنبال کردن این آموزش براحتی حتی با کمترین دانش برنامه نویسی ازاین آیکون های زیبا در سایت و وبلاگ خود استفاده کنید
باما همراه باشید…
مزیت های فونت آیکون های متحرک : یکی از مهم ترین مزیت های این نوع آیکونها حجم کم آنهاست !
آموزش استفاده از فونت آیکون متحرک
ابتدا کد های زیر رو جهت فراخوانی فایل js در فایل header قالب و بعد از تگ head قرار بدید.
نکته : بهتره فایل های زیر رو در هاست خود قرار دهید!
<script src="http://livicons.com/js/jquery-1.9.1.min.js"></script> <script src="http://livicons.com/js/raphael-min.js"></script> <script src="http://livicons.com/js/livicons-demo-1.3.min.js"></script>
جهت فراخونی فونت آیکون ها در مکان مورد نظرتون باید از کد زیر استفاده کنید.
<span class="livicon" data-n="user" data-s="20" data-c="#08aaff" data-hc="false"></span>
معرفی کد فراخوانی فونت آیکون
data-n : نام فونت آیکون
data-c : رنگ فونت آیکون
data-hc : رنگ hover فونت آیکون
data-s : اندازه فونت آیکون
برای استفاده از فونت آیکون متحرک به سایت livicons.com مراجعه کنید و نام آیکون مورد نظر خود را جهت فراخوانی در قسمت data-n وارد کنید.
امید وارم مفید بوده باشه