0

好的,所以我有一个我必须为一个项目做的投资组合,首页只是一个带有加载器的 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
4

1 回答 1

2

好的,所以我最终在头脑中制作了一个变量,并决定如果您使用 Internet Explorer,您将不会获得预加载,有点 hacky 但需要完成它,因为它是一个学校作业的网站。

<script>isExplorer = false;</script>    
<!--[if IE]>
    <script>isExplorer = true;</script>
<![endif]-->    

and then adding an if statement to my jQuery 

    function loadSites(callback){

        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://chrisgjones.com/ninja/';

                $loadCont.load(pageUrl+" "+sourceTarget, function(){

                    var $slide = $('.slide');
                    var $ninja = $('#ninja');
                    var $ninjaCont = $('#ninja-content');
                    var $pageLoader = $('.page-loader');                    
                    var $intro = $('#intro');
                    var $contactForm = $('#contact-form');
                    var $portfolio = $('#portfolio');

                    if(isExplorer == true){


                        //alert('is ie');
                        $slide.css({'height':$winHeight});  
                        $ninjaCont.show();
                        $ninja.interactiveScrolling();
                        $intro.parallaxScrolling();
                        $contactForm.formValidation();                          
                        $portfolio.loadProjectBasic();
                        //callPopAnimations();
                        $pageLoader.hide();                                                 

                    }else if(isExplorer == false){

                        //alert('is not ie');
                        //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});  
                                $ninjaCont.show();
                                $ninja.interactiveScrolling();
                                $intro.parallaxScrolling();
                                $contactForm.formValidation();                          
                                $portfolio.portfolioAnimations();
                                callPopAnimations();
                                //$('.page-loader').hide();     
                                callback.call();                                                    

                            }   // end counter

                        // trigger load event if images have
                        // been cached by the browser
                        }).each(function () {
                            if(this.complete) {
                                $(this).trigger("load");   
                            }   // end cache trigger load
                        }); // end each 

                    }   // end if is explorer or good browser

                }); // end load

            } else {
                // is a touch device so load in the stripped back site
                var $loadCont = $('.full-page');                
                var sourceTarget = '#basic-content';
                var pageUrl='http://chrisgjones.com/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').hide();
                            $('#ninja-content').show();
                        }

                    // trigger load event if images have
                    // been cached by the browser
                    }).each(function () {
                        if(this.complete) {
                            $(this).trigger("load");   
                        }   // end cache trigger load
                    }); // end each

                }); // end ajax load

            }   // end if window width  

    }   // end loadSites
于 2012-12-02T21:52:43.953 回答