کتابخانه متن باز بر پایه جاوا اسکریپت modernizer
32 صفحه در قالب word
فهرست مطالب
2-2. متدهای Polyfills و Modernizr 6
3-1. مرورگرهایی که توسط Modernizr پشتیبانی می شوند. 9
3-2. کلاس های Modernizr متناسب با ویژگی های CSS. 9
3-3. کلاس های Modernizr متناسب با ویژگی های HTML5. 11
3-4. ویژگیهای دیگری که توسط Modernizr پشتیبانی می شوند. 11
4-4.متدهای Polyfills and Modernizr 16
4-5. آموزش Modernizr.load() 17
- چگونهModernizr کار می کند؟. 19
- عناصرHTML5 در IE. 19
- مرورگرهای پشتیبانی شده. 20
- ویژگی های شناسایی شده توسط Modernizr 20
8-1-1. مدل جعبه انعطاف پذیر flexbox. 21
8-7-1. آزمون های اضافی موجود در پلاگین.. 25
9-1.روش Modernizr.prefixed() 25
9-2. تست رسانه پرس و جو MQ () 27
10-1. API های افزونه addTest() 28
10-6. متد _prefixes & _domPrefixes. 30
1.مقدمه
در زمان معرفی رسمی نسل جدید HTML5از سوی کنسرسیوم جهانی وب (W3C) تعداد مرورگرهایی که تگ های HTML5 را پشتیبانی می کردند بسیار محدود بوند، از این رو شرکت های بزرگ مانندMozilla ،Google ،Microsoft و... با چالش جدیدی بر سر راه ساخت مرورگرهای جدید خود مواجعه شدند. این چالش در حالی بود که عقب ماندن از محصول شرکت رغیب برای آنها در پاره ای از مواقع به معنای از دست دادن بازار بود. از این رو اقدام به ساخت مرورگرهایی که بتوانند تمامی تگ هایHTML5 را پشتیبانی نمایند، نمودند. اما این امر تا حدودی غیرممکن به نظر می رسید چرا که تکنولوژیHTML5 بسیار نوظهور بوده و ممکن بود تگ هایی در آینده ساخته شوند و یا به کلی کنار گذاشته شوند. بنابراین آنها تصمیم گرفتند با دادن نسخه های به روز شده بتوانند جوابگوی نیاز روز افزون مشتریان خود باشند. اما تمامی آنها قادر به این کار دشوار نبودند، به شکلی که شرکت مایکروسافت از نسخه 9 به بعد تصمیم گرفت تگ های HTML5 را در مرورگری که کاربران زیادی داشت (IE) پشتیبانی کند، اما شرکت (بنیاد) موزیلا بسیار در این عرصه پخته تر عمل کرده و از نسخه 3.5 به بعد مرورگر Firefox، یعنی حدود یک سال زودتر از مرورگرIE ، تگ های محدودی از HTML5 را پشتیبانی می کرد. چنین رفتاری از سوی مایکروسافت برای کاربران حرفه ای وب، بسیار ناهنجار و ناخوشایند بود. طراحان وب و برنامه نویسان وب نمی خواستند لذت استفاده از فناوری جدید را از دست دهند. اما می بایست عمل Cross Browsing [1]را نیز رعایت می کردند. چرا که ممکن بود در صفحه خود از تگی استفاده کنند که کاربری با یک مرورگر قدیمی تر اصلا سایت را نبیند یا بسیاری از قسمت های در نظر گرفته شده را از دست بدهد.
چنین اعمالی باعث به وجود آمدن تکنولوژی Modernizr شد، Modernizr به وسیله جاوا اسکریپت کار می کند و کدهای جاوا اسکریپت را هم تمامی مرورگرها پشتیبانی می کنند، پس Modernizr به طراحان وب یا برنامه نویسان اجازه می دهد که در صورتی که از تگ HTML5 یا CSS3 در وب سایت خود استفاده کردند، و کاربر به وسیله مرورگری قدیمی، آن سایت را بازدید کند، سایت قابل دیدن باشد. این تکنولوژی به طراحان وب این امکان را می دهد که وب سایتی هدفمند برای کاربران با مرورگرهای قدیمی طراحی نمایند. به طور مثال در صورتی که از گرادیانت در رنگ پس زمینه استفاده شده باشد، این ویژگی را با تصویری با همان گرادیانت برای کاربران با مرورگرهای قدیمی نمایش دهد.
در مجموع با عرضه نسخه های جدید مرورگرهای گوناگون، کماکان مرورگرهایی وجود دارند که تمامی قابلیت های HTML5 وCSS3 را پشتیبانی نمی کنند. همچنین بسیاری از کاربران، هنوز از نسخه های قدیمی مرورگرها استفاده می کنند. در همین راستا طراحان وب جهت نمایش قابلیت های جدید HTML5 و CSS3، باید راهکاری را جهت نمایش مناسب وب سایت خود در مرورگرهای قدیمی کاربران به کار بگیرند.
Modernizr یک کتابخانه بر پایه جاوا اسکریپت است که مرورگر بازدیدکنندگان را بررسی و مشخص می کند مروگر آنها کدام دسته از ویژگی های HTML5 و CSS3 را پشتیبانی می کند و سپس کلاس های مشخصی را به تگ html صفحات اختصاص می دهد. در نتیجه Modernizr ابزار مناسبی برای طراحان جهت شرطی سازی نحوه نمایش صفحات بر اساس مرورگرهای مختلف خواهد بود. (با استفاده از کلاس های شرطی CSS میتوان نحوه نمایش المانها و تگها را بر اساس نوع مروگر بازدید کننده تنظیم نمود.)
در حالت معمول و بدون استفاده از Modernizr، طراح وب سایت باید تمام مرورگرها را بشناسد و بداند که هر یک چه ویژگی‌هایی را پشتیبانی می‌کنند و بر اساس نوع مرورگر کد مربوط به آن را بنویسید؛ اما با استفاده از Modernizr تنها کافی است با پیروی از یک الگوی خاص، تمام مرورگرها به درستی نمایش داده شوند.
1-1. ویژگی های Modernizr
- عدم وابستگی به هیچ سیستمی حتی jQuery
- عدم اضافه کردن افکتهای HTML5 و CSS3 به مرورگر کاربران
- بررسی ویژگیهای HTML5 و CSS3 مرورگر بازدیدکنندگان در چند هزارم ثانیه
برای نمونه توجه شما را به یک مثال توجه نموده و تفاوت مرورگرهای فایرفاکس و اینترنت اکسپلورر در نمایش یا عدم نمایش ستون های چندگانه و سایه ها را جلب می نمایم.
ممکن است هنگام انتقال از فایل ورد به داخل سایت بعضی متون به هم بریزد یا بعضی نمادها و اشکال درج نشود ولی در فایل دانلودی همه چیز مرتب و کامل است
متن کامل را می توانید در ادامه دانلود نمائید
چون فقط تکه هایی از متن برای نمونه در این صفحه درج شده است ولی در فایل دانلودی متن کامل همراه با تمام ضمائم (پیوست ها) با فرمت ورد word که قابل ویرایش و کپی کردن می باشند موجود است
کتابخانه متن باز بر پایه جاوا اسکریپت modernizer
