目标: 页面加载时,慢慢显示页面加载时看不到的 div。
当前代码:
$('h1.page_heading_title').hide().fadeIn(666);
问题: 使用上面的代码时,div 拳头在页面加载时显示,然后隐藏,然后慢慢淡入。这给用户带来了故障效果。
想法:
有没有我在这里完全隐藏 div 然后 fadein() 缺少的东西?我能想到的下一个解决方案是将 div 编辑为 display:none
,然后使用 addClass()
添加一个使用 css 动画的 div 类来完成我的任务。我唯一担心的是,理论上 jquery 应该已经用 .hide().fadIn()
做的事情看起来确实有很多代码。
如有任何帮助,我们将不胜感激。
最佳答案
听起来您的页面加载有点慢。假设你在 $(document).ready()
中有这个,在 DOM 完成渲染之前,它不会运行您的 JavaScript。
您可以确保 <h1>
通过将其设置为 display: none;
在加载前隐藏,使用内联样式或 CSS:
$('h1.page_heading_title').fadeIn(666);
h1.page_heading_title {
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1 class="page_heading_title">This is a heading.</h1>
关于javascript - jQuery hide() Then show() <div> 在页面加载时没有完全隐藏 <div>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45739595/