جستجو
زمانی که متن خود را وارد می نمایید در صورت وجود اطلاعات ، اطلاعات مورد نظر بصورت همزمان و بدون زدن هیچ دکمه ای نمایش داده می شود.
عضویت در خبرنامه
جهت لغو عضویت کلیک نمایید
شمارشگر شبکه های اجتماعی
پسندیده
0
فیسبوک
0
توییتر
0
گوگل پلاس
13
لینک ادین
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
تبلیغات
آخرین تصاویر
شهر تاریخی جیزد باغ شازده ماهان عمارت و باغ نشاط (سالار) تقی آباد غار پرده رستم کاروانسرای شاه عباس یونسی حلزون اسب در کوهستان بچه پنگوئن بچه میمون ديگو کاستا دنی آلوز میامی هیت پیرلو فرانچسکو توتی لیونل مسی طوطی دریا جاده زمستانی گورخر ... ... پل کلبه ببر
وضعیت آب و هوا
  • یزد
  • ارومیه
  • اصفهان
  • البرز
  • مشهد
  • شیراز
  • تبریز
  • تهران
  • زاهدان
  • اهواز
  • زنجان
  • رامسر
  • بابلسر
  • کرمانشاه
  • بندرعباس
  • کرمان
  • گرگان
  • یاسوج
  • همدان
  • آبادان
  • مکه
موضوعات مشابه
CSS3 در Internet Explorer

CSS3 در Internet Explorer

   تعداد بازدید: ۶۰۹
نمایش آمار بازدید روزانه با PHP

نمایش آمار بازدید روزانه با PHP

   تعداد بازدید: ۱۲۹۱
تغییر اندازه تصاویر بوسیله php

تغییر اندازه تصاویر بوسیله php

   تعداد بازدید: ۴۲۸
عناصر جدید HTML5

عناصر جدید HTML5

   تعداد بازدید: ۴۹۵
LiteBox با استفاده از سی اس اس و جی کوئری

LiteBox با استفاده از سی اس اس و جی کوئری

   تعداد بازدید: ۴۵۲