QA پاسخگو Image Polyfill API برای برنامه های مختلف وب
Picturefill یک API آسان برای استفاده، هوشمند و پاسخگو است که می تواند در برنامه های وب مختلف استفاده شود تا اطمینان حاصل شود که کاربران بسته به دستگاه اندازه، وضوح صفحه نمایش و موارد دیگر را می بینند.
Picturefill به عنوان یک API پاسخگو polyfill تصویر منبع باز و رایگان برای استفاده است و با استفاده از Javascript و HTML توسعه یافته است. این برنامه که عمدتاً برای قسمت جلویی برنامه‌ها استفاده می‌شود، می‌تواند افزودنی عالی برای هر پروژه‌ای باشد که در آن کاربران نهایی ممکن است دستگاه‌های مختلفی داشته باشند که در آن به برنامه دسترسی دارند.
Picturefill پشتیبانی و ویژگی های اضافی را برای عناصر Picture و Img در مرورگرها فراهم می کند. این یکی از ساده‌ترین راه‌ها برای اطمینان از این است که مهم نیست کاربران شما از کدام دستگاه به وب‌سایت شما دسترسی دارند، تصاویر به طور خودکار با اندازه و وضوح صفحه نمایش خود تنظیم می‌شوند. Picturefill برای بسیاری از مرورگرها از جمله Safari، Internet Explorer 9، Google Chrome Mozilla Firefox و غیره آزمایش شده است.
شروع کار با PictureFill
روش توصیه شده برای نصب PictureFill از طریق NPM. لطفا از دستور زیر برای نصب آن استفاده کنید.
PictureFill را از طریق NPM نصب کنید
npm install picturefillتصاویر واکنشگرا را از طریق API جاوا اسکریپت رایگان اضافه کنید
کتابخانه منبع باز PictureFill به توسعه دهندگان جاوا اسکریپت اجازه می دهد تا تصاویر واکنش گرا را به سایت خود اضافه کنند، از جمله اطمینان حاصل شود که بینندگان با درگاه های دید با تراکم پیکسلی بالا می توانند دارایی های با وضوح بالا را ببینند و مطابق با آن تنظیم می شود. به همین ترتیب، می‌توانید تعدادی تصویر مشابه اما با اندازه‌های متفاوت به مرورگر ارائه دهید. Picturefill مرتب می کند و بهترین منبع را برای اندازه نمای فعلی کاربر، چگالی نمایش و اندازه دارایی در طرح وب سایت ارائه می دهد. Picturefill همچنین به توسعه دهندگان این امکان را می دهد که تصمیم بگیرند که کدام تصاویر بسته به دید کاربر نمایش داده شوند. با کمک عنصر تصویر، می توانید اندازه های مختلف، سطوح زوم، نسبت های تصویر و غیره را مشخص کنید.
نقطه شکست تصویر را از طریق API جاوا اسکریپت رایگان مشخص کنید
یکی دیگر از ویژگی های Picturefill امکان تعریف نقاط شکست تصویر خاص با گزینه های رزولوشن متفاوت برای تصاویر منبع در وب سایت است. Picturefill همچنین گزینه ای را برای تصمیم گیری تصاویر بازگشتی برای فرمت های تصویری که در فرمت های خاص پشتیبانی نمی شوند، فراهم می کند. به این ترتیب وب سایت شما خطاهای نمایش تصویر را نشان نمی دهد.
پشتیبانی از مرورگرها
کتابخانه منبع باز Picturefill پشتیبانی کاملی از انواع مختلف مرورگرها ارائه کرده است. این کتابخانه آزمایش شده است و بر روی تعداد زیادی از مرورگرها مانند فایرفاکس، گوگل کروم، اینترنت اکسپلورر، سافاری، اپرا و بسیاری دیگر به راحتی کار می کند. هنگامی که جاوا اسکریپت غیرفعال است، مرورگر می تواند متن ویژگی alt را به عنوان یک بازگشت ببیند. این کتابخانه دارای پشتیبانی کامل از IE9 و حتی نسخه قدیمی تر است. برای IE9 و نسخه های جدیدتر، باید یک پوشش عنصر ویدیویی را در اطراف عناصر منبع در تگ تصویر خود بپیچید. مثال زیر نحوه انجام آن را نشان می دهد.
