2

我被难住了...我正在构建一个响应式站点,该站点仅在较大的屏幕上加载较大的图形。它在 IE9/FF/Chrome 中运行良好,但在 IE8 中不起作用。

有谁看到是什么让 IE8 不火?这是我的代码:

<script type="text/javascript">
$(document).ready(function() {
   $(window).resize(function() {
    //small-screen
    if (window.innerWidth < 768) {$('#smiling-model').html('');}
    //end small-screen
    else if (window.innerWidth >= 768) {
        $('#smiling-model:empty').append('<img id="#smiling-model-img" src="images/smiling-model-500x456px.jpg" alt="Great Smile" />');
            }
    }).resize(); // trigger resize event
});
</script>

这是实际网站的链接: http ://www.orlickdental.com/

谢谢大家!

奥马尔

4

5 回答 5

3

据我所知window.innerWidth,低于版本 9 的 Internet Explorer 不支持

有关更多信息,请查看古老的 Quirksmode 提供的DOM 兼容性信息:)

由于您已经在使用 jQuery,因此您可以依赖$(window).width(). 然而——本着知识的精神——掌握窗口的尺寸一直是 IE 的一个问题。做到这一点的主要方法是依靠 body 元素的尺寸(使用 body.clientWidth)或实际插入用 css 设计的特定元素div来填充窗口的尺寸(然后从该元素中读取尺寸)。jQuery 现在显然把所有的乐趣都带走了;)

于 2012-08-27T21:44:34.870 回答
1

使用,但由于jQuery 1.8中的更改(返回宽度) ,请$(window).width()确保页面没有以怪异模式呈现。IE0

简短的回答:<!DOCTYPE html>在页面的开头使用。

于 2012-08-28T10:07:10.800 回答
0

怎么样$(this).width()

$(window).resize(function() {
    //small-screen
    var w = $(this).width();
    if (w < 768) {
       $('#smiling-model').html('');
    }
    //end small-screen
    else if (w >= 768) {
        $('#smiling-model:empty').append('<img id="#smiling-model-img" src="images/smiling-model-500x456px.jpg" alt="Great Smile" />');
    }
 }).resize(); // trigger resize event
于 2012-08-27T21:43:08.183 回答
0

为了浏览器兼容性,我建议使用$(window).width()而不是window.innerWidth.

$(document).ready(function() {
   $(window).resize(function() {

    //cache the width of the viewport
    var width = $(window).width();

    //and check it's value
    if (width < 768) {$('#smiling-model').html('');}
    //end small-screen
    else if (width >= 768) {
        $('#smiling-model:empty').append('<img id="#smiling-model-img" src="images/smiling-model-500x456px.jpg" alt="Great Smile" />');
            }
    }).resize(); // trigger resize event
});

这是一个演示:http: //jsfiddle.net/FpReh/

于 2012-08-27T21:45:54.180 回答
0

在 IE8 的控制台中,我检查了该window.innerWidth值并返回undefined.

而是使用$(window).width();

于 2012-08-27T21:48:37.670 回答