javascript - 想通過js判斷css的媒體查詢 出錯
問題描述
@media screen and (min-width: 360px) and (max-width: 375px){ .ejiao_description .form form p{margin-bottom: 11px; }}
css中媒體查詢是這么寫的js
var screen1 = window.matchMedia(’@media (min-width: 360px) and (max-width: 375px)’); if (screen1.matches){XXXXXX..... } else{XXXX.... }
但是現在沒起作用 請問哪里錯了么
問題解答
回答1:https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia
請看文檔
回答2:<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Title</title> <style>@media screen and (min-width: 360px) and (max-width: 375px){ .aa .form form p{margin-bottom: 11px; }} </style></head><body><!-- 想通過js判斷css的媒體查詢 出錯 --><p class='aa'> <p class='form'><form> <p>123123</p></form> </p></p></body><script> var screen1 = window.matchMedia(’(min-width: 360px) and (max-width: 375px)’); console.log( screen1 ); if (screen1.matches){console.log( 1 ); } else{console.log( 2 ); }</script></html>
為window.matchMedia(’(min-width: 360px) and (max-width: 375px)’);,沒@media
相關文章:
1. objective-c - ios百度地圖定位問題2. html5 - 如何解決bootstrap打開模態modal窗口引起頁面抖動?3. javascript - 求助關于js正則問題4. javascript - node.js服務端渲染解疑5. javascript - 求助這種功能有什么好點的插件?6. html5 - rudy編譯sass的時候有中文報錯7. html - css 如何添加這種邊框?8. 為何 localStorage、sessionStorage 屬于html5的范疇,但是為何 IE8卻支持?9. 微信開放平臺 - Android調用微信分享不顯示10. javascript - 關于定時器 與 防止連續點擊 問題
