نوشتن افزونه جی کوئری: تایپ انیمیشنی متن (قسمت دوم)

- visibility ٢٠ mode_comment

به نام خدا

با سلام خدمت شما دوستان گرامی. بخش دوم آموزش نوشتن افزونه جی کوئری تایپ انیمیشنی متن رو براتون آماده کردم. تو این بخش که تکمیل کننده بخش اوله به کاربر اجازه میدیم تا به راحتی رفتار متد ساخته شده رو تحت کنترل قرار بده. برای این کار چهار مورد از تنظیمات رو برای کاربر آماده می کنیم که بطور خلاصه به صورت زیره:

  • سرعت تایپ متن
  • تعیین علامت چشمک زن تایپ
  • مقدار وقفه زمانی قبل از تایپ متن
  • مقدار وقفه زمانی پس از تایپ متن(جهت فرصت دادن به کاربر برای خواندن متن)

با کمی خلاقیت میشه کارهای زیادی رو به این متدها واگذار کرد و افزونه های جالبی نوشت. امیدوارم برای آشنایی با یه افزونه ساده این مطلب مفید بوده باشه

برای مشاهده آخرین کیفیت و اندازه، پخش کننده را به حالت تمام صفحه درآورید.

.: فقط اعضاي سايت مجاز به ديدن اين قسمت هستند :.
در صورتي که عضو سايت هستيد می توانید لاگین شوید.
در غير اين صورت در کمتر از 1 دقيقه مي توانيد در سايت عضو شويد.

[vip]

[/vip]

 

info نکته :

بنا به درخواست دوستان جهت توسعه کد فعلی، این کد رو به دو روش توسعه دادم که تو این کد مجموعه ای از رشته ها رو دریافت میکنه و اونا رو به ترتیب تایپ میکنه.  در این مورد باید هم بین آرایه ها و هم بین رشته ها حرکت کنیم هم حرکت کنیم. بدلیل کمبود وقت فعلا نمیتونم توضیحات کامل بدم تو قسمت نظرات سوالاتون رو ذکر کنین تا پاسخ بدم. نکته مهمی که تو این کدها مطرحه اینه که یه تنظیم دیگه اضافه شده که انتخاب کننده رشته هاست. به عنوان مثال میخواین عناوین پست ها رو از صفحه موجود دریافت کنین و به ترتیب اون ها رو تایپ کنید حالا یا عناوین تو بخش تایپ شدن جایگزین هم بشن و یا زیر هم تایپ بشن. هر دو مورد رو براتون قرار دادم.

موفق باشین

فراخونی متد:

 

دریافت فایل های پلاگین مربوط به این تغیرات 

 

comment دیدگاه کاربران
veronica

ممنون
اگه آموزش دیگه ای هم دارین لطفا بزارین

حامد مودی

به زودی دوست عزیز

davood azimzadeh

سلام
در این کد در هر کادر فقط یک جمله نمایش داده می شود
اگر بخواهیم بعد جمله اول ،جمله دوم سر جای جمله اول نمایش داده شود باید کد زیر را چگونه ویرایش کنم؟

سون لرن | مرجع آموزش طراحی وب جاوا اسکریپت، پی اچ پی، اچ تی ام ال، سی اس اس و …

آیا به این گونه می شود؟
list[0]=’جمله شماره 1,’;
list[1]=’جمله شماره 2,’;

بین هر آرایه یک (,) بزارید و در آخرش هم سیمیکالن(;) بصورت زیر

list[0]=’جمله شماره 1’,list[1]=’جمله شماره 2’;

davood azimzadeh

آقا وحید درست نشد.
در ضمن می خوام به هر جمله لینک بدم.
این هم آدرس نمونه کدی که شما دادید
http://noor-almahdi.ir/ticker
از شما متشکرم

وحید صالحی

مشکلت الان تو چیه؟ اینکه کارکترها درست نمایش داده نمیشه و در هم هست؟؟

داود

باید جمله اول نوشته بشه
بعد بره
جمله دوم نوشته بشه
هر جمله لینک هم داشته باشه
مثل این سایت
http://www.ashoora.ir
با تشکر

وحید صالحی

توی نمونه کدی که در کامنت قبلی گذاشتی نمونه دوم که عبارت 7learn هست همین حالت رو داره کافیه عبارت مورد نظرت رو در یه تگ a بزاری و مقدار href که لینک به محل مورد نظرت هست رو قرار بدی:

davood azimzadeh

آقا وحید
شما به این آدرس نگاه بندازید
دقیقا کدی که شما گفتید رو قرار دادم
جمله تایپی به آدرسی که میدم لینک نمیشه
وقتی هم روی جمله میری نشانه گر موس به شکل دست نمیشه
فکر کنم مشکل از کد جاوا باشه.
http://noor-almahdi.ir/ticker
باز هم از پاسخگویی شما تشکر می کنم
این هم آدرس کد با پسوند تکست:
http://noor-almahdi.ir/ticker/ticker.txt

وحید صالحی

دوست عزیز برای اینکه بتونی مباحث طراحی رو خوب یاد بگیری اگه کدی جواب نمیده و راه حلی هم براش پیدا نمیکنی سعی کن با روش آزمون و خطا به مشکلت پی ببری شما در این کد تگ a رو درون تگ p گذاشتی که با کد های جی کوئری تداخل داره تگ p رو حذف کن و کلاسش رو به تگ a بده در کد اجرای این افکت هر جا p یا کلاسی که به p دادی با تگ a جایگزین کن درست میشه بعد استایلی رو که به p دادی a اعمال کن

davood azimzadeh

چگونه میشه به متن لینک داد؟
لطفا نمونه کدش رو قرار دهید

سجاد دریس

davood azimzadeh

منظورم در افزونه بالا بود
انجام دادم نشد
http://www.7learn.com/tutorials/video-tuts/jquery-typing-text-plugin-part2/comment-page-1

سجاد دریس

کلا لینک کردن هر چیزی طبق این قاعده است
من تعجب می کنم میگید نمیشه!

davood azimzadeh

این هم کدش

davood azimzadeh

اینجا کدش کار می کنه ولی داخل نوشتن افزونه جی کوئری: تایپ انیمیشنی متن کار نمیکنه
با چند مرورگر هم امتحان کردم

مهدی

(function($) {

$.fn.test = function() {

$(this).hover(function() {

$(this).animate({
color : “green”,
left : “30”,
cursor : “pointer”
}, 3);

}, function() {

$(this).animate({
color : “#000”,
left : “0”
});

})

this.each(function(){
return this;
})

};

})(jQuery);

salam

man in plugin ro neveshtam vli kar nemikone?
dalilesh cheih?

حامد مودی

سلام دوست عزیز لطفا در انجمن سوالتون رو مطرح کنین.

meysam

چطور میشه متن هایی که در دیتا بیس داریم به این صورت نمایش داد؟

سلام باید یه کوئری به دیتابیس بزنید و مقدار مورد نظر رو از دیتابیس بخونید و در محلی که متن قرار داره متن مورد نظرتون رو توسط کوئری مورد نظر قرار بدید.

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.