پلاگین جاوا اسکریپت افکت تایپ متن Typed.js

در این پست از سایت اسکریپت دات کام , یک پلاگین جاوا اسکریپت جالب رو معرفی خواهم کرد که به وسیله آن میتوانید افکت های جالبی برای متن ها ی وب سایت خود ایجاد نمایید .

نام این پلاگین typed.js می باشد که هم به صورت جاوا اسکریپت و هم جی کوئری قابل استفاده است .

در ادامه با ما همراه باشید .

و اما آموزش :

در ابتدا شما باید کتابخانه typed رو از اینجا دانلود نمایید و با استفاده از تگ script به وب سایت خود ضمیمه نمایید :

به عنوان مثال فرض بر اینکه فایل typed.js در پوشه js قرار دارد .

<script src="js/typed.js"></script>

حال به تگی که میخواهید متن ها در آن نمایش داده شود , کلاس vms_TypedJs بدهید . به عنوان مثال :

<h1 class="vms_TypedJs"></h1>

و در آخر کد جاوا اسکریپت زیر را در انتهای صفحه ی خود ( قیل از تگ <body/> قرار دهید ) :

<script>
    document.addEventListener("DOMContentLoaded", function(){
        Typed.new(".element", {
            strings: ["Vahid Majidi Sadr", "Web Designer", "Web Developer"],
       	    typeSpeed:30,
            startDelay:500,
            backSpeed:30,
            backDelay:2000
        });
    });
</script>

نکته 1 : شما میتوانید درون متغیر strings در کد بالا , به جای 3 جمله ای که به صورت پیشفرض نوشته شده است , نوشته های دلخواه خود را قرار دهید و یا حتی به آن جمله های بیشتری اضافه کنید .

نکته 2 : شما میتوانید با تغییر عدد 4 متغیر بالا که هر کدام عددی بر حسب میلی ثانیه در آن قرار گرفته است , سرعت تایپ رفت , برگشت و یا حتی تاخیر بین این دو حالت را عوض نمایید .

توجه : برای استفاده از دیگر تنظیمات این پلاگین به وب سایت مرجع مراجعه نمایید .

پخش اختصاصی

آموزش و گرداوری : وحید مجیدی