開発中のサイトでModernizr2.6.2を使用していて、IE8でイライラするエラーが発生しています。ドキュメントの先頭にModernizrを読み込んでいます：
<script src="js/vendor/modernizr-2.6.0-ck.js"></script>
</body>次に、ページの下部、終了タグの直前にbase.jsファイルをロードします。そのbase.jsファイルには、次のコードがあります（読みやすくするためのHastebinリンク）。
/**
* Non-jQuery hasClass function for checking the existence of
* class names on elements.
* @param {string} scripts The string of scripts to check
* @param {string} cls The class name we're looking for
* @return {boolean} True or false
*/
/*
function hasClass(scripts, cls) {
var r = new RegExp('\\b' + cls + '\\b');
return r.test(scripts);
}*/
/**
* Get ID from <body> tag
*/
function matchBodyID(match) {
return match.toLowerCase() === document.body.id.toLowerCase();
}
/**
* Check to see if the body tag has a "data-scripts" attribute.
* If true, collect the contents. If false, set to false.
*/
// var dataScripts = document.body.getAttribute("data-scripts") || false;
/**
* Variables must be defined before we can use them.
*/
var Modernizr = Modernizr || {},
ScaleText = ScaleText || {};
/*
* Using Modernizr.load, we can run our tests to see
* which features are available to us and load our
* polyfills to handle those that aren't
*/
var timestamp = new Date().getTime();
Modernizr.load([
{
load: [
'//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js',
'js/plugins/image-array-ck.js?t=' + timestamp,
'js/plugins/jquery.debouncedresize-ck.js',
'js/plugins/menu-ck.js?t=' + timestamp
],
complete: function () {
if (!window.jQuery) {
Modernizr.load('js/vendor/jquery-1.8.1.min.js');
}
ScaleText.invoke();
$("#skip-to-content").bind("click.menu", function (event) {
event.preventDefault();
var $this = $(this),
$par = $($this.parent());
$par.toggleClass("open");
});
}
}, {
test: matchBodyID('home') || matchBodyID('department'),
yep: [
'js/plugins/spin.min.js',
'js/slideshow-ck.js',
'css/royalslider/royalslider.css',
'css/royalslider/rs-minimal-white.css',
'js/plugins/tabs-ck.js?t=' + timestamp,
'js/plugins/underscore-min.js'
]
}, {
test: matchBodyID('interior'),
yep: [
'js/plugins/spin.min.js',
'js/plugins/tabs-ck.js?t=' + timestamp,
// 'js/plugins/menu-ck.js?t=' + timestamp,
'js/plugins/underscore-min.js'
]
},
// Check for iOS
{
test: Modernizr.appleios,
yep: [
'js/plugins/ios-ck.js'
]
},
// Functional polyfills
{
test: Modernizr.flexbox,
nope: ['js/polyfills/flexie.js']
}
]);
/*
* ScaleText
* An attempt to create a custom type scaler for
* large type that needs to scale to fit its parent
*/
ScaleText = {
invoke: function () {
$(".scalable").each(function (index, element) {
var $parent = $(element),
$wrapper = ScaleText.wrapIt($parent.first("div"));
$parent.css({
"overflow": "hidden",
"opacity": 0
});
$wrapper.css({
"-webkit-transform-origin": "left top",
"-moz-transform-origin": "left top",
"-ms-transform-origin": "left top",
"-o-transform-origin": "left top",
"transform-origin": "left top"
});
ScaleText.checkSize($parent, $wrapper);
jQuery(window).on("debouncedresize.ScaleText", function () {
ScaleText.checkSize($parent, $wrapper);
});
});
},
checkSize: function ($parent, $wrapper) {
var scrollWidth = $parent[0].scrollWidth,
width = $parent.width(),
scrollHeight = $parent[0].scrollHeight,
height = $parent.height(),
ratio, wRatio, hRatio;
wRatio = width / scrollWidth;
hRatio = height / scrollHeight;
ratio = (wRatio < hRatio) ? wRatio : hRatio;
$wrapper.css({
"-webkit-transform": "scale(" + ratio + ")",
"-moz-transform": "scale(" + ratio + ")",
"-ms-transform": "scale(" + ratio + ")",
"-o-transform": "scale(" + ratio + ")",
"transform": "scale(" + ratio + ")"
});
$parent.css({
"opacity": 1
});
},
wrapIt: function (element) {
var content = $(element).html(),
$wrapper = $("<div>" + content + "</div>");
$(element).empty().append($wrapper);
return $wrapper;
}
};
なんらかの理由で、IE8はModernizr.loadブロックを完全に窒息させていObject doesn't support this property or methodます。スクリーンショットを添付。
なぜこれが起こっているのかについての考えは？
編集
Modernizrのカスタムビルドを使用していることに言及する必要があります：http：//www.hastebin.com/fitaqireha.coffee
