جسٹاگرک میکوکویلیسٹی اپ آئی پی

نماینده MediaQueryList

ویژگی‌های نماینده‌ای که اطلاعات از مطالعه رسانه را ذخیره می‌کند.

ویژگی‌های نماینده‌ای کهنماینده‌یMediaQueryList

ویژگی‌های مجموعه‌ای از

window.matchMedia() یا فقط با matchMedia():

مثال

const mqlObj = window.matchMedia();
const mqlObj = matchMedia();

سعی کنید خودتان امتحان کنید

لطفاً به:

روش window.matchMedia()

ویژگی MediaQueryList

ویژگی توضیح
matches مقدار بولان. اگر مستند با پرسش هماهنگ باشد، true، در غیر این صورت false.
media مقدار رشته‌ای. مطالعه رسانه (لیست).

روش MediaQueryList

روش توضیح
addListener() شنونده جدیدی اضافه می‌کند، که هر بار که نتایج ارزیابی مطالعه رسانه تغییر کند، این عملکرد اجرا می‌شود.
removeListener()

شنونده قبلی که قبلاً اضافه شده است را از لیست مطالعه حذف می‌کند.

اگر شنونده مشخص شده در لیست نیست، هیچ عملی انجام نمی‌شود.

مطالعه رسانه

matchMedia() مطالعه‌ای که می‌تواند به عنوان CSS @media رول ویژگی‌های رسانه هر نوع، مانند min-height،min-width،orientation و غیره.

مثال

matchMedia("(max-height: 480px)").matches);
matchMedia("(max-width: 640px)").matches);

سعی کنید خودتان امتحان کنید

نوع رسانه

مقدار توضیح
all پیش‌فرض. برای همه دستگاه‌های نوع رسانه استفاده می‌شود.
print برای چاپگر استفاده می‌شود.
screen برای صفحه‌نمایش کامپیوتر، تبلت، تلفن هوشمند و غیره استفاده می‌شود.
speech صفحه‌خوانی صوتی برای خواندن صفحات به صورت بلند.

ویژگی‌های رسانه

مقدار توضیح
any-hover آیا هیچ مکانیزم ورودی موجودی وجود دارد که به کاربر اجازه می‌دهد ماوس را روی عنصر قرار دهد؟
میریا کویریز لیول 4 میں شامل کیا گیا تھا。
any-pointer آیا هیچ مکانیزم ورودی موجودی است که دستگاه اشاره‌گر باشد؟ اگر باشد، دقت آن چگونه است؟
میریا کویریز لیول 4 میں شامل کیا گیا تھا。
aspect-ratio تناسب عرض به ارتفاع视‌انداز.
color تعداد بیت هر جزء رنگی وسایل خروجی.
color-gamut استعمال کارگزار و وسایل خروجی که رنگ‌های تقریبی پشتیبانی می‌کنند
（Media Queries Level 4 中添加）
color-index 设备可以显示的颜色数量。
grid 设备是网格还是位图。
height 视口高度。
hover 主要输入机制是否允许用户将鼠标悬停在元素上？
（Media Queries Level 4 中添加）
inverted-colors 浏览器或底层操作系统是否反转颜色？
میریا کویریز لیول 4 میں شامل کیا گیا تھا。
light-level 当前环境光级别（Media Queries Level 4 中添加）。
max-aspect-ratio 显示区域的最大宽高比。
max-color 输出设备每个颜色分量的最大位数。
max-color-index 设备可以显示的最大颜色数。
max-height 显示区域的最大高度，例如浏览器窗口。
max-monochrome 单色（灰度）设备上每种“颜色”的最大位数。
max-resolution 设备的最大分辨率，使用 dpi 或 dpcm。
max-width 显示区域的最大宽度，例如浏览器窗口。
min-aspect-ratio 显示区域的最小宽高比。
min-color 输出设备每个颜色分量的最小位数。
min-color-index 设备可以显示的最小颜色数。
min-height 显示区域的最小高度，例如浏览器窗口。
min-monochrome 单色（灰度）设备上每种“颜色”的最小位数。
min-resolution 设备的最小分辨率，使用 dpi 或 dpcm。
min-width 显示区域的最小宽度，例如浏览器窗口。
monochrome 单色（灰度）设备上每种“颜色”的位数。
orientation 视口的方向（横向或纵向模式）。
overflow-block 输出设备如何处理沿块轴溢出视口的内容（Media Queries Level 4 中添加）。
overflow-inline 是否可以滚动沿内联轴溢出视口的内容（Media Queries Level 4 中添加）。
pointer کم سینٹرل انٹرپوٹ میکانزم پوائنٹر ڈیویسز ہوگا؟ اگر ہو تو اس کی دقت کیا ہوگی؟
میریا کویریز لیول 4 میں شامل کیا گیا تھا。
resolution آپدستری کی ریزولوشن، dpi یا dpcm استعمال کرکے،
scan آپدستری کی سکن سائنس پروسیس کی آؤٹ پُٹ کی جانی ہے。
اسکریپٹنگ اس کا استعمال اسکریپٹ (مثلاً JavaScript) کرسکتا ہے یا نہیں؟ (مدیا کوئئز لیکل 4 میں شامل کیا گیا ہے)
تحديث مدیا کوئئز لیکل 4 میں شامل کیا گیا ہے) میں، آؤٹ پُٹ کی نظر میں کتنا جلد تبدیل کی جاسکتی ہے。
چوڑائی وسیعتی کی چوڑائی。