首頁  >  問答  >  主體

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....
    }

但是現在沒起作用 請問哪裡錯了麼

習慣沉默習慣沉默2687 天前809

全部回覆(3)我來回復

  • 滿天的星座

    滿天的星座2017-07-05 10:40:16

    https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia
    

    請看文件

    回覆
    0
  • 扔个三星炸死你

    扔个三星炸死你2017-07-05 10:40:16

    回覆
    0
  • 我想大声告诉你

    我想大声告诉你2017-07-05 10:40:16

    <!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

    回覆
    0
  • 取消回覆