dstjh46606 2013-12-10 23:52
浏览 77
已采纳

php中的site-onload-gif

problem is, that the website is loading like for about 20 second or longer (user-problems preprogrammed) my solution was to load a pre-site where the user sees a loading screen. i did this with this html-site but i want to do the same in php. the test-page is http://kater.selfhost.me/test/

Source Code:

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
<title></title> 
<script type="text/javascript">
        window.onload = function() {
            document.getElementById("siteLoader").style.display = "none";
            document.getElementById("container").style.display = "block";
        }
</script>
</head>
<body>
<div id="container" style="display:none">
<div id="body">
<iframe src="http://kater.selfhost.me/stats/skins.php" frameborder="0" height="2000px" width="1024px"></iframe>
</div>
</div>
<div id='siteLoader'> 
<div id='siteDetailLoader'> 
<img src='ajax_loader.gif' border='0'> 
Please wait while the page loads...<br /> <br /> 
</div> 
</div>
</body>
</html>

i tried some workarounds, but after searching & testing for about three hours i give up... thanks in advance for any help provided! :-D

  • 写回答

1条回答 默认 最新

  • duagfgfn1981 2013-12-11 00:05
    关注

    Adding what I alredy said at your question commentary, I made a code loading this content via AJAX:

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">

    $( document ).ready(function() {
        //Load content
        loadAjaxContent();
    });

    function loadAjaxContent()
    {

         //VERY IMPORTANT: the URL domain MUST HAVE be the same as your request
         //that's why I'm not writting the full http://kater.selfhost.me/stats/skins.php
        $.ajax({
          url: "/stats/skins.php"
        }).done(function(data) {
            //remove loader
          $("#siteLoader").hide();

            //put PHP content
            $("#ajaxContent").html(data);
        });
    }
</script>
</head>
<body>

<div id="body">

    <div id="ajaxContent" style="width:1024px;"></div>

    <div id='siteLoader'> 
    <div id='siteDetailLoader'> 
        <img src='ajax_loader.gif' border='0' /> 
            Please wait while the page loads...<br /> <br />
     </div>
</div>

    This is the most used way to load asynchronous content in the web. But pay attention at this: The http://kater.selfhost.me/stats/skins.php page is made to open as single page in the web, so it has <html> , <head>, <body> , etc.. tags, so..after loading this page into another you'll have two <html>, <body> .. tags in a same page, this is bad, but modern browsers have an awesome common sense and don't bother by this, but you should know that, and be aware.

    The actual problem why it isn't loading yet, is this javascript in your content:

    <script type="text/javascript"><!--
EXref="";top.document.referrer?EXref=top.document.referrer:EXref=document.referrer;//-->
</script>

    I removed that and now works fine. Remember that's a quick fix, I don't know what this JS does.

    Why it works in <iframe> and doesn't via AJAX? When you open in <iframe> is like opening in a new browser window..and via AJAX, as I have said, it'll load the page content straight inside your "parent" page.

    So, removing this Javascript will work, but awesome further solutions:

    1. If you need to open this page both as content to load (via AJAX), both as single page, you can make two pages.. one for each need.

    2. If you just want to use as content to load, remove <html>, <head>, etc.. tags, and fix Javascript to work inside another page.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 phython路径名过长报错 不知道什么问题
  • ¥15 深度学习中模型转换该怎么实现
  • ¥15 HLs设计手写数字识别程序编译通不过
  • ¥15 Stata外部命令安装问题求帮助！
  • ¥15 从键盘随机输入A-H中的一串字符串，用七段数码管方法进行绘制。提交代码及运行截图。
  • ¥15 TYPCE母转母，插入认方向
  • ¥15 如何用python向钉钉机器人发送可以放大的图片？
  • ¥15 matlab（相关搜索：紧聚焦）
  • ¥15 基于51单片机的厨房煤气泄露检测报警系统设计
  • ¥15 Arduino无法同时连接多个hx711模块，如何解决？