جستجو
زمانی که متن خود را وارد می نمایید در صورت وجود اطلاعات ، اطلاعات مورد نظر بصورت همزمان و بدون زدن هیچ دکمه ای نمایش داده می شود.
عضویت در خبرنامه
جهت لغو عضویت کلیک نمایید
شمارشگر شبکه های اجتماعی
پسندیده
0
فیسبوک
0
توییتر
0
گوگل پلاس
0
لینک ادین
11
نمودار بازدید از موضوع ها
نویسنده : admin تعداد بازدید : ۶۴۶ تاریخ : دوشنبه , ۱۹ خردادماه ۱۳۹۳
نمایش متن بصورت متن تایپ شده بوسیله جی کوئری و سی اس اس
امتیاز دهید
تعداد رای 0 امتیاز 0

از این پلاگین برای نمایش متن بصورت در حال تایپ می توانید استفاده نمایید.این پلاگین به سه نوع مختلف متن شما را نمایش می دهد.

ابتدا استایل ها را فراخوانی می کنیم:

 <link rel="stylesheet" href="static/styles.css">
<link rel="stylesheet" href="http://yandex.st/highlightjs/8.0/styles/github.min.css">

بعد از آن پلاگین مربوط به جی کوئری را فراخوانی کرده :

 <script src="http://yandex.st/jquery/2.0.3/jquery.min.js"></script>
<script src="http://yandex.st/highlightjs/8.0/highlight.min.js"></script>
<script src="../jquery.typist.js"></script>

برای تایپ ساده function  زیر را فراخوانی می کنیم :

 <script>
jQuery(function($) {
$(".typist1")
.typist({
speed: 12,
text: "Hello! "
})
.typistAdd("It"s working!");
});
hljs.initHighlightingOnLoad();
</script>

 برای تایپ کردن با تعویق از function  زیر استفاده می کنیم.

 <script>
jQuery(function($) {
$(".typist2")
.typist({ speed: 12 })
.typistPause(3000) // 3 sec
.typistAdd(" – Professor?! ")
.typistPause(3000) // 2 sec
.typistAdd(" – Good news, everyone!");
});
hljs.initHighlightingOnLoad();
</script>

برای حذف متن هم ازfunction  زیر استفاده می کنیم:

 <script>
jQuery(function($) {
$(".typist3")
.typist({
text: "Sed ut perspiciatis, unde omnis ذ¾ذ¹, ر‡ر‚ذ¾-ر‚ذ¾ ذ؟ذ¾رˆذ»ذ¾ ذ½ذµ ر‚ذ°ذ؛"
})
.typistPause(2000) // 2 sec
.typistRemove(23)
.typistAdd("iste natus error sit voluptatem accusantium doloremque laudantium.")
.typistStop();
});
hljs.initHighlightingOnLoad();
</script>

و در مرحله آخر عناصر html را اضافه می کنیم:

<p class="typist1"></p>
<p class="typist2"></p>
<p class="typist3"></p>

 

 دمو موضوع تایپ متن

comments powered by Disqus
تبلیغات
آخرین تصاویر
شهر تاریخی جیزد باغ شازده ماهان عمارت و باغ نشاط (سالار) تقی آباد غار پرده رستم کاروانسرای شاه عباس یونسی حلزون اسب در کوهستان بچه پنگوئن بچه میمون ديگو کاستا دنی آلوز میامی هیت پیرلو فرانچسکو توتی لیونل مسی طوطی دریا جاده زمستانی گورخر ... ... پل کلبه ببر
وضعیت آب و هوا
  • یزد
  • ارومیه
  • اصفهان
  • البرز
  • مشهد
  • شیراز
  • تبریز
  • تهران
  • زاهدان
  • اهواز
  • زنجان
  • رامسر
  • بابلسر
  • کرمانشاه
  • بندرعباس
  • کرمان
  • گرگان
  • یاسوج
  • همدان
  • آبادان
  • مکه
موضوعات مشابه
معرفی کتابخانه‌ AngularJS

معرفی کتابخانه‌ AngularJS

   تعداد بازدید: ۴۶۹
نشانگر های سفارشی با  CSS و jQuery

نشانگر های سفارشی با CSS و jQuery

   تعداد بازدید: ۵۵۰
عناصر جدید فرم در HTML5

عناصر جدید فرم در HTML5

   تعداد بازدید: ۴۷۹
آپلود چند فایل بصورت Drag and Drop بوسیله  Jquery  و Html5

آپلود چند فایل بصورت Drag and Drop بوسیله Jquery و Html5

   تعداد بازدید: ۷۷۷
آموزش تنظیمات در فایل .htaccess

آموزش تنظیمات در فایل .htaccess

   تعداد بازدید: ۷۶۰