亚洲区国产区激情区无码区,国产成人mv视频在线观看,国产A毛片AAAAAA,亚洲精品国产首次亮相在线

Window matchMedia() 方法

JavaScript Window 對象

matchMedia()方法返回一個新的MediaQueryList對象，該對象表示指定媒體查詢字符串的解析結(jié)果。

matchMedia()方法的值可以是CSS @media規(guī)則的任何媒體功能，例如min-height，min-width，orientation等。

語法：

window.matchMedia(mediaQueryString)
if (window.matchMedia("(min-width: 500px)").matches) {
   /* 視口viewport最小為500像素寬 */
} else {
   /* 視口viewport寬度小于500像素 */
}
測試看看?/?

瀏覽器兼容性

表格中的數(shù)字指定了完全支持matchMedia()方法的第一個瀏覽器版本：

方法
matchMedia()9612.15.110

參數(shù)值

參數(shù)描述
mediaQueryString一個字符串，表示要為其返回新的MediaQueryList對象的媒體查詢

技術(shù)細(xì)節(jié)

返回值：一個MediaQueryList對象，表示指定CSS媒體查詢字符串的結(jié)果

更多實(shí)例

如果視口寬度小于或等于600像素，則背景色為珊瑚色。如果大于600，它將變?yōu)闇\綠色：

var size = window.matchMedia("(max-width: 600px)")
myFunc(size) // 在運(yùn)行時調(diào)用監(jiān)聽器函數(shù)
size.addListener(myFunc) // 在狀態(tài)更改時附加監(jiān)聽器函數(shù)

function myFunc(size) {
  if (size.matches) {
 document.body.style.backgroundColor = "coral";
  } else {
 document.body.style.backgroundColor = "lightgreen";
  }
}
測試看看?/?

相關(guān)參考

CSS教程：CSS媒體查詢

JavaScript Window 對象