Question

我想在我的网站上使用此功能（按'显示'时） - ＆gt; http://labs.voronianski.com/jquery.avgrund.js/

问题是此功能需要将身高设置为100％。在某些时候，在我的网站中，我需要检测滚动用户以使顶部栏显示并消失一些位置。

所以为了加入这两个功能，当我按下按钮显示div avground时，我只将身高改为100％。但是我遇到问题：按钮在页面页脚上，当我改变身高时，它们会自动将我发送到页面顶部并在show de div avground之后。

在div avground出现之前，是否有任何方法没有发生或者可以滚动到页脚？

如果有人有其他解决方案，我很感激。

由于

Answer 1

你实际上不必这样做，对于那个动画你可以使用简单的CSS3：

CSS：

#layer-body {
    -webkit-transition: -webkit-transform 0.5s;
    -moz-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
}
#layer-body.hide {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    transform: scale(0.8);
}
#menu {
    background: rgba(208, 31, 60, .95);
    position: fixed; top: 0; left: 0; z-index: 4;
    width: 100%; height: 100%;
}
#menu.show {
    visibility: visible;
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
}
#menu.hide {
    visibility: hidden;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s;
    transition: transform 0.5s, visibility 0s 0.5s;
}

HTML：

<body>
    <div id="layer-body"></div>
    <div id="menu"></div>
</body>

这意味着，您的所有网站都在＃layer-body内，而菜单在#menu内。

因此，当您打开菜单时，您必须将HIDE类添加到＃layer-body并显示给#menu。

Answer 2

您是否尝试过使用bootstrap的模态？在我看来，它们非常简单，看起来更好。

http://getbootstrap.com/javascript/

按按钮使$（“body”）。css（“height”：“100％”）

2 个答案: