Question

我有一个带有splashscreen元素的div。该元素将在页面加载时隐藏。但是，我还想确保启动画面显示至少x秒。

我知道这不应该被格式化为代码，但是自动格式化程序让我这样做。

使用逻辑：显示启动画面至少x秒。如果该页面被加载，则隐藏此div。

此代码是加载页面后立即隐藏div的部分。

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
            $(document).on("pageload",function(){
                $('#splashscreen').hide();
            });
        </script>
        <title>Thomas Shera</title>
    </head>
    <body>
        <div id="splashscreen">
        </div>
    </body>
</html>

这是我将启动画面显示x秒的部分。

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
            $(function() {
                $("#div2").show().delay(x).hide();
            });
        </script>
        <title>Thomas Shera</title>
    </head>
    <body>
        <div id="splashscreen">
        </div>
    </body>
</html>

所以基本上我在问，我该如何组合这两个jquery代码？

编辑：我现在正在尝试使用此代码，但仍然无效。

<!DOCTYPE html>
<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">

    $(document).on("pageload",function(){
               $('#splashscreen').hide();
});

$(function() {
     $("splashscreen").show().delay(1000).hide();
 });

</script>

<style type="text/css">
  @import url(https://fonts.googleapis.com/css?family=Cutive+Mono);

  .skills
  {
    font-family: 'Cultive Mono', monospace;
    font-size: 400pt;
  }

</style>

<title>Thomas Shera</title>

</head>
<body>
  <div id="splashscreen">
    <p i="skills">
      Javascript  Technical writing   VBA scripting with Microsoft Office   Excel
      Entrepreneur
    </p>
  </div>
</body>
</html>

Answer 1

希望这有帮助。

<强> HTML

<body onload="splash(3000)">

<强>的Javascript

function splash(param) {
 var time = param;
 setTimeout(function () {
   $('#splashscreen').hide();
 }, time);
}

从CSS显示#splashscreen元素块，当页面加载时，它将隐藏javascript。

如果您想测试一下，请从Google加载高分辨率图片。如果从浏览器缓存中加载网站内容，您的启动将显示网站内容加载或至少x秒数。

页面加载时显示启动画面，但至少持续x秒

1 个答案: