好的,所以我有一个我必须为一个项目做的投资组合,首页只是一个带有加载器的 div,当你登陆首页时,它会检测屏幕大小并选择使用 ajax 拉入的内容。
我这样做是因为 iPad/Mobile 网站非常简单,而且我没有足够的时间制作另一个网站,所以它只是一个非常简单的版本。
我的问题是它在 Internet Explorer 中根本不起作用。它似乎加载了内容,但加载后没有做任何功能,例如应用插件和隐藏加载器。
当它开始计算图像时,我有一种感觉它崩溃了,所以我想知道我是否可以使用 Modernizer 来检测它的 Internet Explorer 并执行更简单的加载功能,还是我的代码有问题?
该网站的链接是http://chris-g.dmlive.co.nz/
并且加载函数如下
function loadSites(){
var $winHeight = $window.height();
var $winWidth = $window.width();
if($window.width() >= 1025) {
// is desktop so load all scripts and set heights to window height
var $loadCont = $('.full-page');
var sourceTarget = '#ninja';
var pageUrl='http://chris-g.dmlive.co.nz/ninja/';
$loadCont.load(pageUrl+" "+sourceTarget, function(){
var $slide = $('.slide');
var $ninja = $('#ninja');
//var $imgs = $(this).find("img");
var $imgs = $ninja.find("img");
$imgs.hide();
var loadCounter = 0;
var nImages = $imgs.length;
$imgs.load(function () {
loadCounter++;
if(nImages === loadCounter) {
// all the images have loaded
// reveal them, remove the loading indicator
$imgs.show();
$slide.css({'height':$winHeight});
$('#ninja-content').show();
$('.page-loader').fadeOut(500);
$ninja.interactiveScrolling();
$('#intro').parallaxScrolling();
$('#contact-form').formValidation();
$('#portfolio').portfolioAnimations();
callPopAnimations();
}
// trigger load event if images have
// been cached by the browser
}).each(function () {
if(this.complete) {
$(this).trigger("load");
}
});
}), function(){
}; // end ajax load
} else {
// is a touch device so load in the stripped back site
var $loadCont = $('.full-page');
var sourceTarget = '#basic-content';
var pageUrl='http://chris-g.dmlive.co.nz/basic-page/';
$loadCont.load(pageUrl+" "+sourceTarget, function(){
var $basicContent = $('#basic-content');
//var $imgs = $(this).find("img");
var $imgs = $basicContent.find("img");
$imgs.hide();
var loadCounter = 0;
var nImages = $imgs.length;
$imgs.load(function () {
loadCounter++;
if(nImages === loadCounter) {
// all the images have loaded
// reveal them, remove the loading indicator
$imgs.show();
$('#portfolio').loadProjectBasic();
$('#contact-form').formValidation();
$('.page-loader').fadeOut(500);
$('#ninja-content').show();
}
// trigger load event if images have
// been cached by the browser
}).each(function () {
if(this.complete) {
$(this).trigger("load");
}
});
}); // end ajax load
} // end if window width
} // end loadSites