简体   繁体   English

页面闪烁加载 - 隐藏/显示javascript - Total Newbie

[英]Page flickers on load - hide/show javascript - Total Newbie

Ok so here goes.. I'm totally new to Javascript. 好的,所以这里..我是Javascript的新手。 I only started on html&css about a month ago. 我一个月前才开始使用html&css。 All my htl and css is probably pretty backward and i've got a stack to learn. 我所有的htl和css都可能非常落后,我有一堆学习。 I'm using two pieces of javascript - one piece loads the nivo slider and the other the hide and show easy tabs: 我正在使用两个javascript - 一个加载nivo滑块,另一个隐藏并显示简单的标签:

http://www.kollermedia.at/archive/2007/07/04/easy-tabs-11-free-tab-menu/ http://www.kollermedia.at/archive/2007/07/04/easy-tabs-11-free-tab-menu/

Both were fine when I hacked them to hell trying to get them to look the way I wanted. 当我把它们砍成地狱试图让它们看起来像我想要的那样时,两者都很好。 Since i've put them together all hell has broken loose (bit of an exageration) but it may as well have because although they are both working, the page flickers badly on load. 因为我把它们放在一起所有地狱都已经破裂了(一点点夸张)但它也可能因为虽然它们都在工作,但页面在加载时会严重闪烁。 I have been researching this and I hear it's called DOM flicker. 我一直在研究这个,我听说它叫做DOM闪烁。 I know it's due to the hidden divs showing before the script kicks in. I also notice that the increased page height, for the split second (sometimes longer) it takes the content to hide activates the scroll bars and i know this could have an affect. 我知道这是由于在脚本启动之前显示隐藏的div。我还注意到增加的页面高度,对于瞬间隐藏内容的瞬间(有时更长)会激活滚动条,我知道这可能会产生影响。 I'm also using background images within the links on mouse over commands.... i didn't know what else to do. 我也在鼠标悬停命令的链接中使用背景图像....我不知道还能做什么。

I've read you can add script to only show the content once the script has loaded but I know zero javascript : ) ... yet! 我已经读过你可以添加脚本只在脚本加载后显示内容但是我知道零javascript:)...然而!

Can somebody please help me fix this? 有人可以帮我解决这个问题吗? I've read lots of posts around the net but they all put the code with gaps where your supposed to fill in and where it's put is expected to be known. 我已经阅读了很多关于网络的帖子,但是他们都把代码放在了你应该填写的位置以及预期放置的地方。 I'm sorry to be such a mong but could someone literally copy and paste my javascript and edit that to show me? 我很抱歉成为这样一个mong但是有人可以直接复制并粘贴我的javascript并编辑它以显示给我?

I know it's a lot too ask but i've been trying to fix this all day. 我知道这也很多,但我一整天都试图解决这个问题。 Here's a link showing the problem (when selecting the portfolio links the delay / flicker lasts ages!) 这是一个显示问题的链接(当选择投资组合链接时,延迟/闪烁持续年龄!)

link to the site: http://www.adam-ashton.co.uk/homepage.html 链接到该网站: http//www.adam-ashton.co.uk/homepage.html

(sorry to be so long winded) (对不起这么久啰嗦)

Thanks, David 谢谢,大卫

Page Flicker can be handled with the help of some css 可以在某些CSS的帮助下处理页面闪烁

.hideME {

visibility:hidden;
}

Add this class to the Top Most Element (Mostly a div ) of you html page 将此类添加到html页面的Top Most Element(主要是div)

And inside the script tag , 在脚本标签内,

write a window.load function 写一个window.load函数

$(window).load(function() {

  $(selector).removeClass('hideMe');
});

this should do the magic :) 这应该做的魔术:)

在第46行添加这一行代码。表示window.load的第一行

   $('.container').removeClass('hideMe');

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM