<div class="box">Your Login / splash info goes here</div>


<div>
    This is your original page content.

    This is the stuff I assume you want to be behind the splash div.
</div>

.box{
    background: #000000;
    color: #666;
    opacity: 0;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

.splash{
    opacity: .9;
    padding: 50%;
    -webkit-transition: opacity 1s 1s, -webkit-transform 5s;
    -moz-transition:    opacity 1s 1s,    -moz-transform 5s;
    -ms-transition:     opacity 1s 1s,     -ms-transform 5s;
    -o-transition:      opacity 1s 1s,      -o-transform 5s;
    transition:         opacity 1s 1s,         transform 5s;

    -webkit-transform: translateY(0px);
    -moz-transform:    translateY(0px);
    -ms-transform:     translateY(0px);
    -o-transform:      translateY(0px);
    transform:         translateY(0px);

}

setTimeout(function() {
    $('.box').addClass('splash')
}, 5);​

<div class="splash">
    <div class="container">
        Username: <input type="text"/> Password: <input type="password"/>
    </div>
</div>

.splash {
    top: 0;
    left: 0;
    background: black;
    color: #888;
}
.splash,
.splash .container {
    display: none;
    position: absolute;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}
.splash .container {
    position: relative;
    top: 50%;
    width: 100%;
    text-align: center;
}

$(document).ready(function(){
    var $window = $(window),
        $splash = $('.splash'),
        $container = $splash.find('.container'),
        seconds = 5;

    var position = function(){
        var position = {
            top: $window.scrollTop(),
            left: $window.scrollLeft(),
            height: $window.height(true),
            width: $window.width(true)
        };

        $splash.css(position);

        return position;
    };

    var open = function(){
        if (seconds--) {
            return setTimeout(open, 1000);
        }

        position();

        $window.bind('scroll.splashposition resize.splashposition', position);

        $splash.fadeTo(300, .9, function(){
            $container.fadeTo(200, 1);
        });
    };

    var close = function(e){
        if ($(e.target).is($splash)) {
            $window.unbind('scroll.splashposition resize.splashposition');
            $container.fadeTo(300, 0, function(){
                $splash.fadeTo(200, 0);
            });
        }
    };

    $container
        .css({opacity: 0, display: 'block'});

    $splash
        .css({opacity: 0, display: 'block'})
        .click(close);

    open();
});

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://onehackoranother.com/projects/jquery/boxy/javascripts/jquery.boxy.js"></script>

<link rel="stylesheet" type="text/css" href="http://onehackoranother.com/projects/jquery/boxy/stylesheets/boxy.css">

<p>The splash page will display in 5 second(s).</p>
<!-- Used as the source for the modal window. -->
<div id="splash-message">
    <div id="modal-message">
        <h1>Title Block</h1>
        <p>This is a splash message. This is a link to <a href="http://yahoo.com" target="_blank">Yahoo!</a></p>
        <p>Click to dismiss.</p>
    </div>
</div>

$(document).ready(function(){
    var $blackout,
        options = {
            modal: true,
            closeText: 'Dismiss',
            show: false
        },
        message = $('#splash-message').html(),
        dialog = new Boxy(message, options),
        step = 5;

    var close = function(){
        if (!$blackout) {
            $blackout = $('.boxy-modal-blackout');
            $blackout.bind('click.detectboxyclose', close);

            return;
        }

        dialog.toggle();

        $('.boxy-modal-blackout').unbind('click.detectboxyclose');
    };

    var splash = function(){
        if (step < 1) {
            dialog.toggle();
            close();

            return;
        }

        step--;
        setTimeout(splash, 1000);
    };

    splash();
});