如何复制这个css媒体jquery使用javascript支持IE

How to replicate this css media jquery using javascript to support IE

本文关键字:jquery 媒体 使用 javascript IE 支持 css 何复制 复制      更新时间:2023-09-26
@media all and (max-width:1000px){
    #div {
        left: 500px;
    }
}
@media all and (min-width:1000px){
    #div {
        left: 50%;
    }
}

有人能帮我用javascript/jquery方法实现同样的效果,让我的网站将支持旧版本的IE吗?谢谢。

你应该首先使用像modernizr这样的东西来检查你的浏览器的功能(不仅仅是IE不支持媒体查询),然后设置一些监听$(window).resize()的东西,并相应地改变你的布局。参见:http://api.jquery.com/resize/

有点像:

if (!Modernizr.mq('(max-width:1000px)'){
  $(window).bind('resize load',function(){ //the load will make the style rules apply on load as well (i.e. noone's resizing the window)
    if ($(window).width() > 1000){
      //layout big version
    } else {
      //layout small version
    }
  });
}