我正在制作一个由几个部分划分的网站
<div id='section-1' class='section'>web content</div>
<div id='section-2' class='section'>web content</div>
我的网页上有十个部分,当文档通过 javascript 准备好时,每个部分的高度都设置为用户窗口高度
$('.section').height($(window).height());
我网页上的某些效果(例如幻灯片)需要计算出该部分的高度才能正常工作。因此,我总是在准备好文档时使用类似的东西作为解决方案。
setTimeout(startslideshow,1000);
setTimeout(startanimations,1000); ...etc
确保部分高度是幻灯片代码开始之前的用户窗口高度,因为一旦加载网页后,部分无法立即更改为用户窗口高度,这将在我的幻灯片代码中产生严重问题,例如错误的计算位置。
因此会出现这样一种情况,页面加载后,大约有一秒钟的时间一切都搞砸了,在一切正常之前,我怎么能避免被用户看到呢?我试着$(document).hide()
,或者$('html,body').hide()
,然后在一秒钟后淡入,但我遇到了其他奇怪的问题,尤其是在 ipad 上,我的固定位置顶部导航栏在用户滚动时总是会变成“不固定”。
由于我是自学者,恐怕我的方法不典型。我想知道真正的 web 程序员在必须将他的网页分成不同的部分并将其高度设置为窗口高度时通常会做什么,然后确保依赖于部分高度的其他效果正常工作并避免等一下高度变化?