خرید آنلاین تحقیق مقاله پاورپوینت کتاب و نرم افزار اندروید

فروشگاه اینترنتی جوبوک دانلود فروش خرید آنلاین اینترنتی تحقیق مقاله پاورپوینت نرم افزار اندروید و کتاب کلیه رشته ها فنی مهندسی علوم انسانی علوم پایه

فروش پوشاک استوک مارک دار
http://kia-ir.ir

دانلود خرید بهترین کاملترین تحقیق Modernizr کتابخانه بر پایه جاوا اسکریپت


Modernizr یک کتابخانه بر پایه جاوا اسکریپت است که مرورگر بازدیدکنندگان را بررسی و مشخص می کند مروگر آنها کدام دسته از ویژگی‎های HTML5و CSS3 را پشتیبانی می‎کند و سپس کلاس‎های مشخصی را به تگ html صفحات اختصاص می‎دهد. در نتیجه Modernizr ابزار مناسبی برای طراحان جهت شرطی ‎سازی نحوه نمایش صفحات بر اساس مرورگرهای مختلف خواهد بود. (با استفاده از کلاس‎های شرطی CSS می‎توان نحوه نمایش المان‎ها و تگ‎ها را بر اساس نوع مروگر بازدید کننده تنظیم نمود.)

در حالت معمول و بدون استفاده از Modernizr، طراح وب سایت باید تمام مرورگرها را بشناسد و بداند که هر یک چه ویژگی‌هایی را پشتیبانی می‌کنند و بر اساس نوع مرورگر کد مربوط به آن را بنویسید؛ اما با استفاده از Modernizr تنها کافی است با پیروی از یک الگوی خاص، تمام مرورگرها به درستی نمایش داده شوند.

1-1. ویژگی های Modernizr

 عدم وابستگی به هیچ سیستمی حتی jQuery

 عدم اضافه کردن افکت‎هایHTML5و CSS3 به مرورگر کاربران

بررسی ویژگی‎هایHTML5و CSS3مرورگر بازدیدکنندگان در چند هزارم ثانیه

برای نمونه توجه شما را به یک مثال توجه نموده و تفاوت مرورگرهای فایرفاکس و اینترنت اکسپلورر در نمایش یا عدم نمایش ستون های چندگانه و سایه ها را جلب می نمایم.

 

نمایش ستون های چندگانه و تصویر سایه دار در مرورگر فایرفاکس

عدم نمایش ستون های چندگانه و تصویر سایه دار در مرورگر اینترنت اکسپلورر

استایل جایگزین به کمک Modernizr و نمایش در مرورگر اینترنت اکسپلورر (حتی نسخه های ٦ به پایین)


2. Modernizr چیست؟

این اسکریپت ۴۰ ویژگی HTML5 و CSS3 را برای مرورگر بازدیدکنندگان در چند هزارم ثانیه بررسی نموده نتیجه آزمایش را به شیء Modernizr اختصاص می دهد. سپس کلاس هایی را به تگ html صفحه اضافه می نماید که مشخص کننده پشتیبانی یا عدم پشتیبانی مرورگر بازدید کننده از ویژگی خاصی خواهد بود. همچنینModernizr با معرفی تابع Load خود امکان بارگذاری شرطی اسکریپت هایPolyfills را جهت بهینه سازی المان های صفحه برای مرورگرهای قدیمی فراهم می آورد.

نمونه ای از Source صفحات وب که پک کامل اسکریپت Modernizr را اجرا می کند.

2-1. نصب Modernizr

ابتدا به صفحه دانلود Modernizr مراجعه نمایید در این صفحه بیش از ۴۰ ویژگی CSS3 و HTML5 به همراه ویژگی های دیگر Modernizr قابل مشاهده می باشد. توصیه می شود بعد از تکمیل شیوه نامه اصلی سایت، فاکتورها و ویژگی های html5 و CSS3 استفاده شده در طرح خود را مشخص کرده سپس اقدام به انتخاب پکیج Modernizr نمایید تا حجم پکیج این اسکریپت تا حد امکان کاهش و سرعت بارگذاری آن افزایش یابد.

البته شما می توانید پک کامل Modernizrرا کپی کرده و ذخیره نمایید. به توصیه نویسنده اسکریپت، می بایست بعد از ذخیره سازی Modernizr، فایل مورد نظر را داخل تگ<head> و بعد از لینک شیوه نامه به پوسته خود معرفی نمایید.

2-2. متدهای Polyfills و Modernizr

منظور از Polyfill اسکریپت هایی است که به منظور هموارسازی و هماهنگ سازی API های جدید برای مرورگرهای قدیمی استفاده می شوند. به عنوان مثال زمانی که شما از websocket Polyfill استفاده می کنید این اسکریپت کلاسwindow.websocket را با همان مقادیر و متدهای اورجینالWebsocket در مرورگرهای قدیمی ایجاد می نماید. بنابراین احتیاجی به نگارش API متفاوت برای مرورگرهای قدیمی نبوده تنها کافیست API اصلی (websocket) را توسعه داده و با استفاده از websocket Polyfill این قابلیت را به مرورگرهای قدیمی بیافزایید. تقریبا برای تمامی ویژگی هایی که Modernizr شناسایی می کند یک اسکریپت polyfill جهت بهینه سازی آن ویژگی HTML5) یا CSS3 (برای مروگرهای قدیمی نوشته شده است .

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

2-3. تابع Modernizr.load

تابع Loadیکی از ویژگی های Modernizr است که در صفحه دانلود می توانید آن را به پکModernizr خود بیافزایید. این تابع منابع ( فایل های شیوه نامه CSS و جاوا اسکریپت JS) شما را به صورت شرطی بارگذاری می نماید. اگر ملزم به استفاده از polyfills می باشید امکان بارگذاری یا عدم بارگذاری polyfills مختلف متناسب با مرورگر بازدیدکنندگان و با کمک Modernizr.load فراهم شده، حجم ترافیک وب سایت شما کاهش می یابد.

یک مثال :

 

Modernizr.load({

test: Modernizr.geolocation,//ویژگی مورد نظر

yep : geo.js, // درصورت برقراری شرط باگذاری می شود

nope: geo-polyfill.js //رد شرط باعث بارگذاری این اسکریپت می شود

});

 

در این مثال ابتدا، Modernizr مرورگر بازدید کننده را برای ویژگی geolocation بررسی می کند. در صورتی که مرورگر مورد نظر این ویژگی را پشتیبانی نماید اسکریپت اول (geo.js) و در صورت عدم پشتیبانی و رد شرط، اسکریپت geo-polyfill بارگذاری خواهد شد.

 

// می توانید آرایه ای از شرط ها را جهت بررسی وارد نمایید.

Modernizr.load([

// Presentational polyfills

{

// ویژگی هایی که برای اجرای پوسته خود نیاز داریم.

test : Modernizr.fontface && Modernizr.canvas && Modernizr.cssgradients,

// در صورت عدم پشتیبانی اسکریپت و شیوه نامه زیر بارگذاری خواهد شد.

nope : [presentational-polyfill.js, presentational.css]

},

// Functional polyfills

{

// This just has to be truthy

test : Modernizr.websockets && window.JSON,

// socket-io.js and json2.js

nope : functional-polyfills.js,

// همچنین می توان آرایه ای از اسکریپت ها و شیوه نامه ها را جهت بارگذاری معرفی کنید.

both : [ app.js, extra.js ],

complete : function () {

// بعد از پایان یافتن اسکریپت ها دستورالعملی که در این مکان قرار می گیرد اجرا خواهد شد.

myApp.init();

}

},

// بعد از اجرای تمامی اسکریپت های پیش فرض حال می توانید آنالیکتیک خود را اجرا کنید.

post-analytics.js

]);

 

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

تابعLoad بر پایه اسکریپت yepnope.js نگارش شده اما مستقلا توسطModernizr اجرا می شود. با استفاده از Modernizr می توانید از اجرای اسکریپت خاصی مطمئن شوید تنها کافیست آدرس های متفاوتی از منبع اسکریپت مورد نظر را به این تابع اختصاص دهید. در مثال بعد آدرس متفاوت جهت اجرای jQuery به این تابع اختصاص یافته که در صورت عدم دسترسی به آدرس اول، لینک کمکی برای بارگذاری استفاده می شود.

 

Modernizr.load([

{

load: //ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js,

complete: function () {

if ( !window.jQuery ) {

Modernizr.load(js/libs/jquery-1.7.1.min.js);

}

}

},

{

// بعد از اجرای جی کوئری اسکریپتی که به آن وابسته است اجرا خواهد شد.

load: needs-jQuery.js

}

]);

 

 

3. چگونگی عملکرد

با اجرای صفحه، Modernizr شیء Modernizr را در مرورگر کاربر ایجاد می نماید. که می توان این شیء را توسط اسکریپت های دیگر فراخوانی کرد. همچنین با توجه به پکی که دانلود و نصب گردیده کلاس هایی (CSS) را به تگ html صفحه مورد نظر می افزاید.

به این ترتیب می توان نحوه نمایش المان­هایی که از ویژگی های HTML5 و CSS3 استفاده می کنند، به صورت شرطی در شیوه نامه تعریف کرد. وب سایت BrowserStackابزار مناسبی جهت آزمایش صفحات وب در مرورگرهای مختلف خواهد بود. این وب سایت بیش از ۳۰۰ مرورگر مختلف را شبیه سازی می نماید.

3-1. مرورگرهایی که توسط Modernizr پشتیبانی می شوند.

  • IE نسخه ۶ و بالاتر
  • FireFox نسخه ۳.۵ و بالاتر
  • Opera نسخه ۹.۶ و بالاتر
  • Safari نسخه ۲ و بالاتر
  • Chrome تمامی نسخه ها
  • iOS’s mobile Safari
  • Android’s WebKit
  • Opera Mobile
  • Firefox Mobile
  • Blackberry نسخه ۶ و بالاتر

 

3-2. کلاس های Modernizr متناسب با ویژگی های CSS


مبلغ واقعی 6,500 تومان    10% تخفیف    مبلغ قابل پرداخت 5,850 تومان

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

Captcha

برای مشاهده ضمانت خرید روی آن کلیک نمایید

  انتشار : ۱۰ آبان ۱۳۹۴               تعداد بازدید : 485

برچسب های مهم

جوبوک سایت مطمئن خرید و دانلود تحقیقات و مقالات ارزان نمونه سوالات پکیج مطالب آموزشی حراج تخفیف مقاله و تحقیق نرم افزار با هدف رضایت مشتری و افزایش فرهنگ کتابخوانی و علم تلگرام https://t.me/jobook
" فروشگاهی از 4KIA "

فید خبر خوان    نقشه سایت    تماس با ما