【问题标题】:Javascript spinning circle animation while loading page does not stop加载页面时Javascript旋转圆圈动画不会停止
【发布时间】:2018-11-17 08:07:29
【问题描述】:

所以我已经坐了几个小时,但似乎无法弄清楚为什么我的代码不起作用。

我正在尝试在我的页面加载时制作“旋转圆圈”(或类似的)动画。到目前为止,我基本上是这样做的,但我的问题是它不会停止,所以我的页面的其余部分不会加载。

Javascript:

// Wait for window load
$(window).load(function() {
    // Animate loader off screen
    $(".se-pre-con").fadeOut("slow");;
});

HTML: 基本上只是一个类的 div

<div class="se-pre-con"></div>

CSS

.no - js# loader {
    display: none;
}

.js# loader {
    display: block;
    position: absolute;
    left: 100 px;
    top: 0;
}

.se - pre - con {
    position: fixed;
    left: 0 px;
    top: 0 px;
    width: 100 %;
    height: 100 %;
    z - index: 9999;
    background: url(images / loader - 64 x / Preloader_2.gif) center no - repeat# fff;
}

注意:我使用了这个教程:https://smallenvelop.com/display-loading-icon-page-loads-completely/

其他注意事项:我正在为 ASP.NET MVC 应用程序编写此内容

【问题讨论】:

  • 您检查过控制台日志吗?您在控制台日志中得到了什么?
  • 哇,我太傻了,忘记了。它给了我参考错误$ is not defined。现在我知道出了什么问题,可能真的很愚蠢
  • 没关系。享受编码!
  • 哈哈,谢谢,会做的
  • $ is not defined 你必须包含 jQuery :)

标签: javascript html css asp.net


【解决方案1】:

好的,这是一个非常简单的修复。基本上我只是在渲染我的 jQuery 之前调用了我的脚本。我的标题以前是这样的:

    <head>
        <script type="text/javascript" src="~/Scripts/LoadSpinner.js">
</script>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
        <title>@ViewBag.Title - DeviceManagment</title>
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryui")
</script>
    </head>

我所要做的就是在我的 jQuery 渲染之后调用我的 Javascript 文件。

非常简单的解决方案,但仍然希望它可以帮助那里的人。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-04-25
    • 1970-01-01
    相关资源
    最近更新 更多