javascript - 尝试将 mmenu.js(非 Canvas 菜单)集成到我的网站中,但我的粘性页脚有问题

标签 javascript jquery css mmenu

我正在尝试在我的站点中添加一个非 Canvas 菜单,我选择的菜单是 mmenu( http://mmenu.frebsite.nl/index.php )。除了我的页脚之外的其他一切都有效。我在网站上有一个粘性页脚,每次单击菜单打开时,页脚都会飞出位置。

对于固定页脚,添加类 mm-fixed-bottom: id="footer"class="mm-fixed-bottom">再见<

Example: http://jsfiddle.net/1eddy87/Lx5ps/1/

我已经尝试过记录的方式,它说您应该对任何固定元素使用“mm-fixed-bottom”,但是这并没有奏效。

Documentation: http://mmenu.frebsite.nl/tutorial.php

滚动到页面底部,然后通过页眉打开菜单,您将看到页脚移出位置。

有什么想法吗??

我意识到我使用的是绝对的,而不是固定的。这是对粘性页脚(http://mystrd.at/modern-clean-css-sticky-footer/)的要求。我试图通过希望 mm-fixed-bottom 能工作来解决我的问题,但事实并非如此。我需要使用绝对值的修复程序。

最佳答案

你有 position:absolute在页脚上应该是 fixed .您还覆盖了 mm-fixed-bottom 中的 CSS .我认为粘性页脚的全部原因是它停留在屏幕底部而不移动。

我删除了所有定位并且它起作用了。

http://jsfiddle.net/Lx5ps/3/


找到的解决方案:

经过进一步检查,库似乎发生了变化 <div class="mm-page">height:100%哪个螺钉与height:auto .我在浏览器检查器中将其关闭并且它有效。

改变了这个:

html.mm-opened .mm-page {
    height: auto;
    overflow: hidden;
    position: absolute;
}

http://jsfiddle.net/Lx5ps/4/

关于javascript - 尝试将 mmenu.js(非 Canvas 菜单)集成到我的网站中,但我的粘性页脚有问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22001434/

相关文章:

php - 使用纯 javascript 返回并嵌入图像,例如 php?

php - 使用 jQuery 滑动一个 div 打开一个关闭

html - flexbox:两个垂直图标之间没有空间

javascript - Angular 如何根据另一个元素更新元素宽度

JavaScript RegEX 显式字符仅匹配一次

javascript - 包含 jquery-mobile.js 链接后不再重定向

javascript - 使用 javascript 控制 css 过渡

css - Bootstrap - 类文本中心不适用于内部 div

html - 表格中框之间无法解释的间隙

javascript - React Native中 "folly/Portability.h"和 "File .../main.jsbundle does not exist"如何解决?