javascript - 隐藏div onload函数JS
问题描述
我只想隐藏这个 div onload 但它不起作用。
这是片段:
$(window).load(function() {
$('.preloader').fadeOut('slow');
});
.preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
background-image: url('loading.gif');
background-repeat: no-repeat;
background-color: #8f8f8f;
background-position: center;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="preloader"></div>
解决方案
我已经添加了工作片段,临时我添加了一个超时来查看淡出的效果。您可以使用带有$(document).ready
函数的 jQuery 来使其工作。
$(document).ready(function() {
setTimeout(function() {
$('.preloader').fadeOut('slow');
}, 3000);
});
.preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
background-image: url('loading.gif');
background-repeat: no-repeat;
background-color: #8f8f8f;
background-position: center;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="preloader"></div>
推荐阅读
- ansible - 未定义另一个变量使用的 Ansible 测试
- sql - 为什么这个表达式会导致 SQL 错误?
- key - 翻译键 VTiger
- python - 即使 Anaconda 删除 Path 仍然表明 Anaconda 仍然存在
- angular - D3 饼图仅在一侧渲染一次 *NgFor Angular
- twilio - 获取按属性、类别或标签名称排序的 Twilio 聊天用户频道
- docker - 关于 docker-compose up 时 docker 容器的退出
- c# - 升级到 3.1 c# 时请求实体为 Null
- reactjs - Tailwind CSS:伪类之前
- spring-boot - 春季启动 2.2.5。如何在 Spring Filter 中检索 PathVariable 参数