jquery - 如何更改移动设备的HTML类？

如何将Bootstrap类.row-eq-height更新为仅用于移动设备的display: block;？

这就是我尝试过的。

$(document).ready(function() {
    if ($(window).width() <= 768) {
        $( ".row-eq-height" ).css( "display", "block" );
    }
});

最佳答案

CSS方法：

@media (max-width: 768px) {
    .row-eq-height {
        display: block;
    }
}

确保更改像素值以定位特定的移动设备。

在此处阅读有关媒体查询的更多信息：CSS Media Queries - MDN Docs。



jQuery / JS方法：

function checkPosition() {
    if (window.matchMedia('(max-width: 768px)').matches) {
        //Do this
    } else {
        //Do that
    }
}

由于使用了window.matchMedia()，因此以上代码不支持IE9。

在此处阅读有关此方法的更多信息：Window.matchMedia() - MDN Docs。

关于jquery - 如何更改移动设备的HTML类？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31442946/