illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید تا کنون 6337 نفر در 14 دوره آموزشی سون لرن ثبت نام کرده اند !

ترفندهای پیشرفته jQuery (قسمت 33)

0 264 ۱۶ آبان ۹۴

در این قسمت با ادامه ترفندهای پیشرفته jQuery در خدمت شما هستیم.
jquery trickshot

موضوع پنجم : استفاده از پلاگینها

یکی دیگه از دلایلی که jQuery رو محبوب کرده اینه که طراحان و توسعه دهندگان زیادی پلاگینهای مختلفی برای jQuery میسازن و به اشتراک میزارن. بهمین دلیل قبل شروع یک پروژه میتونین با کمی جستجو پلاگینهای با کیفیتی رو برای کارتون انتخاب کنید. در این موضوع تعدادی از پلاگینهای خوب و کاربردی رو به شما معرفی میکنیم.

ترفند 63 : بررسی پشتیبانی HTML5 با استفاده از Modernizr

با وجود اینکه Modernizr جزئی از jQuery نیست ، این ابزار یکی از ابزارهای ضروری و واجب برای هر طراح وبی هست که با HTML5 کار میکنه. این ابزار به شما این امکان رو میده که تشخیص بدین مرورگر کاربرتون از ویژگی خاصی پشتیبانی میکنه یا خیر. با استفاده از این ابزار میتونین بعضی از کدها رو در زمان خاصی اجرا کنید.

در ابتدا باید به صفحه دانلود برید و مواردی که میخاید رو انتخاب کنید و بعد از اون روی bulid کلیک کنید تا فایل در اختیارتون قرار بگیره. بعدش باید بصورت زیر اونو قرار بدین:

بعد از اینکار شما میتونین ویژگی های مورد نظرتون رو تست کنید:

خروجی هر کدوم از تستهای بالا یا true خواهد بود یا False. نتیجه ای که در مرورگر من داده شده بصورت زیر است:

میبینید که مرورگر من از بیشتر موارد پشتیبانی میکنه. همونطور که میبینید مرورگر من از خاصیت لمسی ( Touch ) پشتیبانی نمیکنه ، بنابراین اگر بخشی از اپلیکیشن شما لمسی هست میتونین با فهمیدن این مورد اونو نمایش ندین و اونو به کاربرتون گوشزد کنید.

ترفند 64 : آوردن media query به jQuery

Modernizr یک امکان خوب دیگه رو هم در اختیارمون قرار میده که خیلی به اون اشاره نشده. با استفاده از این امکان شما میتونین از media query در javascript یا jquery استفاده کنید و از قدرت اون بهره ببرید. این امکان به شما اجازه میده که با توجه به سایز و جهت صفحه ، محتواتون رو متناسب نشون بدید.

برای اینکه بتونین از این امکان استفاده کنید ، باید در صفحه دانلود Modernizr خصوصیت mq رو هم انتخاب کنید.

در ابتدا کتابخانه Modernizr رو وارد میکنیم:

از حالا میتونین media Query هارو تجزیه و تحلیل کنید:

میبینید که در ابتدا المنت window رو در یک متغیر cache کردیم. بعد از اون برای این متغیر یک رویداد resize تعریف کردیم که با هر بار تغییر اندازه تابع مورد نظر صدا زده میشه. بعد از اون درون if ها و درون Modernizr.mq اون media query هایی که مدنظرمون هست رو وارد میکنیم. این موارد یا true رو برمیگردونن و یا false رو. با توجه به جوابی که برمیگردونن میشه کارهای مختلفی رو انجام داد.

Modernizr ویژگی های بسیار زیاد دیگه ای هم داره که میتونین از اون بهره ببرید. برای مطالعه بیشتر در مورد این ابزار پرکاربرد و محبوب میتونین به این لینک مراجعه کنید.

امیدوارم از این مطلب خوشتون اومده باشه.

موفق و پیروز باشید

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

:: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
عضویت/ ورود سریع با :
در حال اتصال ...

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :
7LearnTelegram