استفاده از تصاویر پوستر در محتوای افزونه

چند هفته پیش، Chrome تنظیم محتوای جدیدی را اعلام کرد که محتوای افزایه‌ای را که تشخیص می‌دهد حاشیه‌ای نسبت‌به محتوای اصلی سایت است به‌طور خودکار موقتاً متوقف می‌کند و برای همه کاربران Chrome نسخه ۴۵ و بالاتر (نسخه پایدار سپتامبر ۲۰۱۵) فعال خواهد شد. این کار ازنظر استفاده از CPU و مصرف برق برای کاربران شما مفید است، اما ممکن است باعث شود محتوای کامل ارائه‌شده در وب‌سایتتان را نبینند.

خوشبختانه، این تنظیم به روشی مشابه با عناصر ویدیو، پارامتر پوستر را نیز رعایت می‌کند. این امکان را به شما می‌دهد که به‌جای هر فریمی که Chrome محتوای افزایه شما را روی آن متوقف می‌کند، تصویری را مشخص کنید که باید به‌جای افزایه متوقف‌شده استفاده شود.

در اینجا نمونه‌ای از استفاده عملی از آن آورده شده است. اگر Chrome تصمیم بگیرد flash.swf را موقتاً متوقف کند، poster.png به‌جای آن نمایش داده خواهد شد. اگر کاربر روی پوستر کلیک کند، محتوای Flash به‌صورت عادی پخش خواهد شد.

<object data="http://example.com/flash.swf"  
        type="application/x-shockwave-flash"
        poster="poster.png">
</object>

مقدار پارامتر پوستر به همان روشی تفسیر می‌شود که مشخصه srcset برچسب img تفسیر می‌شود، بنابراین می‌تواند از نمایشگرهای با DPI بالا نیز پشتیبانی کند. در اینجا نمونه‌ای از نحو srcset آورده شده است:

<object data="http://example.com/flash.swf"  
        type="application/x-shockwave-flash"
        poster="snapshot1x.png 1x, snapshot2x.png 2x">
</object>

مهم است که تصویر استفاده‌شده همان ابعاد محتوای افزایه را داشته باشد - درغیراین‌صورت، تصویر ممکن است در صفحه کاربر تحریف‌شده نمایش داده شود