Quiero saber que en mi aplicación web, el usuario hace clic en el menú, a veces se almacena en búfer para cargar la página.
Entonces, el tema que usé para crear el sistema tiene una animación incorporada para eso. Cómo puedo activar esto al cargar hasta que la página se cargue por completo para ver.
esta es la animacion
<div id="loading" class="overlay"><i class="fas fa-2x fa-sync-alt fa-spin"></i></div>Así es como lo coloqué en la página.
<div class="card"> <div class="card-header"> <h3 class="card-title"> <b>Company List</b> </h3> </div> <div id="loading" class="overlay"> <i class="fas fa-2x fa-sync-alt fa-spin"></i> </div> <!-- /.card-header --> <div class="card-body p-0"> <table class="table table-striped"> <tr> <th> Company Name </th> <th> @Html.DisplayNameFor(model => model.Status) </th> <th></th> </tr> <tbody> @foreach (var item in Model) { <tr> <td> @Html.DisplayFor(modelItem => item.CompanyName) </td> <td> @Html.DisplayFor(modelItem => item.Status) </td> <td> @Html.ActionLink("Edit", "Edit", new { id = item.Id }, new { @class = "btn btn-warning pull-right" }) @Html.ActionLink("View", "Details", new { id = item.Id }, new { @class = "btn btn-success pull-right" }) @Html.ActionLink("Delete", "Delete", new { id = item.Id }, new { @class = "btn btn-danger pull-right" }) </td> </tr> } </tbody> </table> </div> <!-- /.card-body --> </div>Usé este JQuery
<script> $(window).load(function () { $('#loading').hide(); }); </script>$(window).load() se eliminó en jQuery 3.0. Intenta usar:
$(window).on('load', function () { $('#loading').hide(); });