预装载机间歇性地不隐藏

时间:2015-03-19 22:18:35

标签: jquery html ipad transition preloader

预装载器似乎挂起并间歇性地卡在本网站上: http://www.notashop.com.au/new/#home

进度条似乎显示已完成加载,但是它只是卡住了,并且没有显示下面的页面。

我在这里使用教程:http://tympanus.net/codrops/2014/08/05/page-preloading-effect/comment-page-3/#comment-465289

预加载器代码如下。任何见解将不胜感激!

(function() {

    var support = { animations : Modernizr.cssanimations },
        container = document.getElementById( 'ip-container' ),
        header = container.querySelector( 'header.ip-header' ),
        loader = new PathLoader( document.getElementById( 'ip-loader-circle' ) ),
        animEndEventNames = { 'WebkitAnimation' : 'webkitAnimationEnd', 'OAnimation' : 'oAnimationEnd', 'msAnimation' : 'MSAnimationEnd', 'animation' : 'animationend' },
        // animation end event name
        animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ];

    function init() {
        var onEndInitialAnimation = function() {
            if( support.animations ) {
                this.removeEventListener( animEndEventName, onEndInitialAnimation );
            }

            startLoading();
        };

        // disable scrolling
        window.addEventListener( 'scroll', noscroll );

        // initial animation
        classie.add( container, 'loading' );

        if( support.animations ) {
            container.addEventListener( animEndEventName, onEndInitialAnimation );
        }
        else {
            onEndInitialAnimation();
        }
    }

    function startLoading() {
        // simulate loading something..
        var simulationFn = function(instance) {
            var progress = 0;
            var myTimer = setInterval(function() {
                var temp = $('.pace-progress').attr('data-progress-text');
                progress = parseFloat(temp) / 100.00;
                instance.setProgress(progress);
                if (progress == 1) {
                    clearInterval(myTimer);
                    console.log('Page fully loaded');
                    if (progress >= 1) {
                        classie.remove(container, 'loading');
                        $('button.trigger').removeClass('gone');
                        classie.add(container, 'loaded');
                        progress = null;
                        var onEndHeaderAnimation = function(ev) {
                            if (support.animations) {
                                if (ev.target !== header) return;
                                this.removeEventListener(animEndEventName, onEndHeaderAnimation);
                            }
                            classie.add(document.body, 'layout-switch');
                            window.removeEventListener('scroll', noscroll);
                            // $('.title').velocity({
                            //                              opacity: 1,
                            //                          }, {
                            //                              duration: 500
                            //                          });
                        };
                        if (support.animations) {
                            header.addEventListener(animEndEventName, onEndHeaderAnimation);
                        } else {
                            onEndHeaderAnimation();
                        }
                    }
                }
                }, 200);
            };
            loader.setProgressFn(simulationFn);
        }

        function noscroll() {
            window.scrollTo( 0, 0 );
        }

        init();

})();

0 个答案:

没有答案