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. word-wrap该如何使用？2. mysql主从，从库锁表会导致复制阻塞吗？3. mysql中的join on查询语句的on能否改为where4. 为什么HTML5规范中会包含一些和html无关的东西？如本地存储等。5. mysql - 我用SQL语句 更新 行的时候,发现全部 中文都被清空了,请问怎么解决?6. update方法不能更新字段值为0的数据7. javascript - ES5的闭包用ES6怎么实现8. javascript - 小米浏览器中，图片导致fixed定位的元素无法显示9. javascript - 为什么!function foo(){}返回false，!function foo(){}()返回true？10. html - 特殊样式按钮 点击按下去要有凹下和弹起的效果
网公网安备