طراحی و بهینه سازیمشاهده


 

آموزش وردپرس WordPressآموزش وردپرس WordPress سایت

آموزش جی کوئری jQueryآموزش جی کوئری jQuery جاوا اسکریپت

آموزش انگولار جی اس Angular JS آموزش انگولار جی اس 2 AngularJS 

آموزش اچ تی ام ال HTML5 CSS3آموزش HTML5 و CSS3 اچ تی ام ال 5

آموزش پی اچ پی PHPآموزش پی اچ پی PHP پک 1 برنامه نویسی وب

آموزش سئو SEO آموزش سئو سایت و وردپرس SEO گوگل 

آموزش هک قانونی آموزش هک قانونی - نفوذ و امنیت - پک1

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

آموزش زامارین Xamarinآموزش زامارین Xamarin برنامه نویسی موبایل

هاست

آموزش ایجاد افکت shake + جی کوئری

آموزش ها , جی کوئری , متفرقه , مقالات,آموزش,ترفند
آموزش ایجاد افکت shake + جی کوئریReviewed by Admin on Jul 21Rating:

در پست امروز دنیای جی کوئری، سری به تابع ()animate زدیم و با استفاده از اون، یک افکت جذاب و متفاوت رو برای شما همراهان عزیز آماده کردیم. در این افکت – که نام اون رو shake گذاشتیم – خواهید دید که چطور میشه با استفاده از تابع animate و چند کد ساده دیگه، زمین و زمان رو به لرزه در آورد .

خوب! پیش از هرکاری، اول باید کتابخانه جی کوئری رو در قالبتون فراخوانی کنید…
و در مرحله بعد، تابعی رو با نام shake، به صورت زیر تعریف میکنیم: (این تابع رو میتونید در یک فایل js یا داخل تگ script به کار ببرید)

JQUERY:

 

سه بخش اصلی در قطعه کد بالا عبارتند از:

  1. استفاده از پروپرتی position:relative  که موقعیت عنصر رو نسبت به حالت استاتیک تنظیم میکنه.
  2. تعریف یک حلقه جهت کنترل تعداد دفعات لرزه.
  3. استفاده از 4 تابع animate که موقعیت عنصر ارسالی ما رو نسبت به مبدأ و وضعیت left، به صورت انیمیشنی جا به جا میکنند.

و کار تموم.

فقط در مرحله آخر، کافیه که یک عنصر رو به همراه تابع shake فراخوانی کنید. به عنوان نمونه:

لرزش یک div فرضی، در صورت کلیک بر روی آن!

JQUERY:


به کانال تلگرام بیست اسکریپت بپیوندید !

دانلود

دستگاه جوجه کشی

مطلب مفیدی بود ؟
نویسنده : admin تاریخ : 1393/04/30 4 آموزش ها , جی کوئری , متفرقه , مقالات,آموزش,ترفند

لینک کوتاه مطلب : http://www.20script.ir/?p=7572

کلمات کلیدی پست :
درگاه پرداخت
مطالب مرتبط
4,380دانلود فرم ارسال دیدگاه بسیار زیبا جی کوئری تاریخ : 1392/09/3
3,213اسلاید تمام صفحه و لغزان به صورت جی کوئری تاریخ : 1395/05/13
4,794نمایش تصاویر به سبک تم فارست با جی کوئری تاریخ : 1393/05/4
4,146افکت گذاری بسیار زیبا بر روی تصاویر با جی کوئری تاریخ : 1392/12/17
3,258ارور 404 در صفحه مطالب وردپرس تاریخ : 1394/05/16
5,821نمایش متون دلخواه به صورت لایت باکس تاریخ : 1393/05/21
3,688آموزش اجرای متد ها در jquery تاریخ : 1392/08/30
3,945ایجاد انیمیشن متنی با Textillate به صورت جی کوئری تاریخ : 1393/04/22
2,958پلاگین جی کوئری زیبا ساز چک باکس تاریخ : 1393/04/30
2,187نمایش آخرین مطالب ویرایش شده وردپرس تاریخ : 1394/05/9
3,970لایک و دیسلایک برای Nuke 8.3 تاریخ : 1392/07/28
2,123جلوگیری از اسپم ها در انجمن ویبولتین تاریخ : 1392/11/3
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب
آموزش طراحی سایت با سئو بالا مثل دانلودها توسط طراح اصلی آن دریافت و مشاهده