Question

我在这个页面上有一个包含两个和两个图像的页面。页面加载时一个表单提交用户验证页面，并在用户验证第二个表单提交并且站点打开后重定向回此页面。我想以图像格式和等待图像显示欢迎信息。但我的页面是在图像加载一段时间之前提交的。这是我的页面代码

<?php

    $return_url = "index.php?".$_SERVER[QUERY_STRING];
    $return = base64_encode($return_url);

    $headers = apache_request_headers();

    $date_check1 = date('Y-m-d');
    $date_check2 = date('d-m-Y');

    $auth_confirm = md5('commonauth');

    $contextURL = 'http';
    if ($_SERVER["HTTPS"] == "on") {$contextURL .= "s";}
    $contextURL .= "://";
    $http=$contextURL;
    $contextURL = $contextURL.$_SERVER['SERVER_NAME'].$_SERVER['SCRIPT_NAME'];
    if($_SERVER['QUERY_STRING']) $contextURL = $contextURL."?".$_SERVER['QUERY_STRING'];

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML>
<HEAD>
<TITLE>Welcome to a new world of interaction</TITLE>
<style>
.mainimage {background:url("templates/site1/images/Spotlight_Test.jpg") no-repeat scroll 0 0 #FFFFFF !important;height:212px;width:612px;}
.waitingimage {background:url("templates/site1/images/ajaxLoader.gif") no-repeat scroll 0 0 #FFFFFF !important;height:43px;width:43px;}
</style>
</HEAD>
<script>
function commonAuth(){
    if(document.referrer == '<?=$http?>authenticationsite.com/'){
        var days = '';

        days = '<?php echo $_REQUEST["passwordExpiration"] ?>';

        if(days > 0){

            document.Form1.submit();
        }else{          
            document.Form2.submit();
        }


    }else{


        if(window.location.hash){
            var hs = window.location.hash;
            var pos = hs.indexOf('#');
            hs = hs.substring(pos+1);
            var hshval = '&hv='+hs;

            document.Form3.returnURL.value = '<?php echo $contextURL; ?>'+hshval;
        }else{
            document.Form3.returnURL.value = '<?php echo $contextURL; ?>';
        }
        document.Form3.submit();
    }

}

</script>
<BODY>
<CENTER>
<div style="margin-top:100px;">
            <div class="mainimage">&nbsp;</div>                   
            <div>
                <span><h1 style="color:#95A1AA;font-size:20px;margin-bottom:5px;font-weight:normal;">Authenticating, please wait.</h1></span>
                <div class="waitingimage">&nbsp;</div>
           </div>
</div>
</CENTER>
<form name=Form3 action="<?=$http?>authenticationsite.com/" method="post">
        <input type="hidden" name="returnURL" value="" />
        <input type="hidden" name="failureURL" value="" />
        <input type="hidden" name="forcePassword" value="" />
</form>
<form name=Form1 action="index.php" method="post">

    <input type="hidden" name="username" value="<?php echo $_REQUEST['NTUserID'] ?>" />
    <input type="hidden" name="passwd" value="<?php echo $auth_confirm ?>" />
    <input type="hidden" name="option" value="com_user" />
    <input type="hidden" name="task" value="login" />
    <input type="hidden" name="return" value="<?php echo $return?>" />
    <input type="hidden" name="2cc1761a4c5bc389d76f95b376bcb07d" value="1" />
</form>
<form name=Form2 action="index.php" method="post">
    <input type="hidden" name="qs" value="<?php echo $_SERVER[QUERY_STRING] ?>" />  
</form>
<script>
commonAuth();
</script>
</BODY>
</HTML>

Answer 1

而不是这个

<script>
commonAuth();
</script>

这样做。

<script>
window.onload = commonAuth;
</script>

Answer 2

使用CSS，JavaScript或Ajax预加载图像的3种方法：

http://perishablepress.com/3-ways-preload-images-css-javascript-ajax/

在页面之前加载图像

2 个答案: