I am using jQuery to a simple task.
(我正在使用jQuery完成一项简单的任务。)
Task is to simply show a loading animation from none progress until page is completely loaded.(任务是简单地显示从没有进度直到页面完全加载的加载动画。)
The thing i am experiencing is that the animation shows up after 50-75% time and then goes hidden after the page is completely loaded (I am referring it as delay in next parts of question).
(我正在经历的事情是,动画在50-75%的时间后出现,然后在页面完全加载后变得隐藏(我将其称为问题的下一部分中的延迟)。)
Points to note:
(注意事项:)
-> If I put Animation Code in header.php
and script
in footer.php
then the code shows delay(Mentioned).
(->如果我将动画代码放在header.php
,将script
放在footer.php
那么代码将显示delay(提及)。)
-> If i put both Animation Code and script
in header.php
the animation never get hidden (Ambiguous to me).
(->如果我将动画代码和script
放在header.php
则动画永远不会被隐藏(对我来说模棱两可)。)
For both in footer.php
it gets hidden but shows delay.(对于footer.php
两者,它都被隐藏,但显示延迟。)
I want to know the reason why my page is doing this behavior, what is the best approach of doing this task.
(我想知道我的页面执行此行为的原因,什么是执行此任务的最佳方法。)
(I know my approach is not the best one since its misbehaving)((我知道我的方法自行为以来并不是最好的方法))
Note: My main page includes both header.php
and footer.php
files.
(注意:我的主页同时包含header.php
和footer.php
文件。)
My Question ends here.
(我的问题到此结束 。)
This is bootstrap loading animation.
(这是引导加载动画。)
(Working Fine. No problem with it. Just to show)((工作正常。没问题。只是为了展示))
Animation Code
(动画代码)
<div id="Loading">
<div class="spinner-border m-5" role="status" >
<span class="sr-only" >Loading...</span>
</div>
</div>
And this is what i function i am using for for hiding the animation on page is completely loaded.
(这就是我用来隐藏页面上的动画的功能已完全加载。)
(Also Working Fine. No problem with it. Just to show)((也可以正常工作。没问题。只是为了展示))
Script
(脚本)
<script>
$(document).ready(function($) {
$('#Loading').fadeOut("slow");
});
</script>
ask by Rizwan Amjad translate from so
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…