没有滚动条的启动画面

Question

几天前，我制作了一个当前修复的简单启动画面，并在用户点击按钮时设置了一个cookie（永远不再出现）。

基本上，它只是一个div出现在页面的主要内容之前。

我的问题是即使启动画面使用了所有的宽度和高度，滚动条也会不断出现。我第一次不关心这个，因为它是position:fixed并且内容总是在那里，无法向上或向下滚动。

今天我在手机上看到，滚动时，有时你可以看到启动画面后面的内容。

所以主要问题是滚动条。因此我决定不惜一切代价隐藏滚动条 但是overflow:hidden不起作用 如果我将position: relative放入启动的父级，它也不起作用。

如何禁用滚动？无论如何我能用CSS做到吗？我应该用javascript来解决问题吗？

这是我的故事和我的主页的小提琴： http://jsfiddle.net/tomas2387/G8M4D/

正如您所看到的，即使我使用overflow:hidden，启动画面也在前面，但滚动就在那里。

由于

Answer 1

添加：

html,body{
    overflow:hidden;
}

Works for me

或者 - 根据您的具体情况，您可能需要添加：

html,body{
    padding:0;
    margin:0;
}

然后将modal--mobile-splashpage部分之后的所有内容包装在另一个元素中，并在显示初始化时隐藏它。然后，您可以根据需要切换两个（启动和内容）。 See demo here

Answer 2

html,body{
    overflow:hidden;
}

当你隐藏启动画面时，只需使用jquery来回滚动

$('html,body').css('overflow','auto');

Answer 3

试试这个：

body {
     overflow-y: scroll;
     position: fixed;
     width: 100%;
}