页面是:https://www.steveodell.co/kotuprinting.html
这会在多个不同的浏览器上发生。
有人知道发生了什么事吗?
我猜
在https://www.steveodell.co/assets/js/all.js你有:
$("body").imagesLoaded(function(){
$(".page-loader div").fadeOut();
$(".page-loader").delay(200).fadeOut("slow");
});
你应该淡出'.loader'
而不是'.page-loader'
按:Shift+Ctrl+I,选择Console,在">"提示符下写一行:
$(".page-loader, .page-loader div").fadeIn(1000); $(".loader, .loader div").fadeOut(3000);
可能的解决方案
找到在你的HTML,你有文件assets/js/all.js
把那个文件复制到别的地方,这样你就可以备份它,以防万一。
查找靠近顶部的行:
// Page loader
$("body").imagesLoaded(function(){
$(".page-loader div").fadeOut();
$(".page-loader").delay(200).fadeOut("slow");
});
然后改成:
$("body").imagesLoaded(function(){
$(".loader div").fadeOut();
$(".loader").delay(200).fadeOut("slow");
});
即在两个地方将.page-loader
改为.loader
。
如果您进入控制台并输入以下代码:
$('.page-loader, html').css({overflow:'auto'});
看起来还可以。如果是这样,那么在CSS(或JavaScript)的某个地方,你将html
的溢出设置为scrollbar
, .page-loader
的溢出设置为hidden
。
好的,我想我已经找到了-在文件assets/css/style.css
中你有:
html{
overflow-y: scroll;
-ms-overflow-style: scrollbar;
}
html, body{
height: 100%;
-webkit-font-smoothing: antialiased;
}
.page{
overflow: hidden;
}
试试改成:
html{
overflow-y: auto;
-ms-overflow-style: scrollbar;
}
html, body{
height: 100%;
-webkit-font-smoothing: antialiased;
}
.page{
overflow: auto;
}
(两处改为auto
)
在Firebug中,层次化形式的body标签后的主元素有一个style="display: none"
。然而,这并没有包含在HTML页面中。因此,它假定您通过jQuery包含了这个。如果您对该元素应用了fadeOut()
效果,请检查您的代码