1

我正在使用一些代码来创建一种闪屏,使用此处的文件淡入淡出一些图像:http: //tutorialzine.com/2010/11/apple-style-splash-screen-jquery/

但是,我正在尝试解决如何阻止图像淡出,然后它会创建一个图像,慢慢建立起来,然后最终淡出以显示下面的网站...

我对此很陌生,所以试图找到要更改的代码对我来说是一个问题,我正在使用下面的代码 - 任何人都可以指导我了解我需要更改的内容以达到我想要的结果吗?

// 自执行匿名函数,// 开发 jQuery 插件的标准技术。

(函数($){

$.fn.splashScreen = function(settings){

    // Providing default options:

    settings = $.extend({
        textLayers      : [],
        textShowTime    : 3500,
        textTopOffset   : 80
    },settings);

    var promoIMG = this;

    // Creating the splashScreen div.
    // The rest of the styling is in splashscreen.css

    var splashScreen = $('<div>',{
        id  : 'splashScreen',
        css:{
            backgroundImage     : promoIMG.css('backgroundImage'),
            backgroundPosition  : 'center '+promoIMG.offset().top+'px',
            height              : $(document).height()
        }
    });

    $('body').append(splashScreen);

    splashScreen.click(function(){
        splashScreen.fadeOut('slow');
    });

    // Binding a custom event for changing the current visible text according 
    // to the contents of the textLayers array (passed as a parameter)

    splashScreen.bind('changeText',function(e,newID){

        // If the image that we want to show is
        // within the boundaries of the array:

        if(settings.textLayers[newID]){
            showText(newID);
        }
        else {
            splashScreen.click();
        }
    }); 

    splashScreen.trigger('changeText',0);

    // Extracting the functionality as a 
    // separate function for convenience.

    function showText(id){
        var text = $('<img>',{
            src:settings.textLayers[id],
            css: {
                marginTop : promoIMG.offset().top+settings.textTopOffset
            }
        }).hide();

        text.load(function(){
            text.fadeIn('slow').delay(settings.textShowTime).fadeOut('slow',function(){text.remove();
                splashScreen.trigger('changeText',[id+1]);
            });
        });

        splashScreen.append(text);
    }

    return this;
}

})(jQuery);

4

0 回答 0