Zurb Foundation Offcanvas菜单在以编程方式切换后停止工作-Java 学习之路

我在一个WordPress主题中使用了Zurb Foundation 5和一个offcanvas菜单，这是一个普遍的工作，但我遇到了一个问题：

除了顶栏中的汉堡包图标外，我还可以选择在单击固定位置div元素.back-to-menu时打开菜单 . 为了实现这一点，我使用该方法以编程方式打开offcanvas菜单，如Zurb的文档中所述 . 虽然这很好用，但在我点击div.back-to-menu打开菜单然后再次关闭菜单后，我似乎无法通过点击顶栏中的汉堡图标打开菜单了 .

这是打开菜单的代码：

jQuery('.back-to-menu').click(function(event) {
    event.preventDefault();
    jQuery('html, body').animate({scrollTop: 0}, duration);
    setTimeout(function() {
        $('.off-canvas-wrap').foundation('offcanvas', 'show', 'move-right');
    }, duration);
    return false;
})

有人可以帮忙吗？

2 回答

3
这似乎是Foundation中的一个错误，当我在Foundation文档页面上执行您的脚本时发生相同的错误，菜单打开和关闭但随后被破坏 .

解决方法是通过模拟汉堡包图标上的单击来触发offcanvas：
```
setTimeout(function() {
    $('.off-canvas-wrap').find('.left-off-canvas-toggle').click(); 
}, duration);
```
这不像使用“官方”方式那样整洁，但这是万无一失的，当然比使用它后打破菜单更好 .

显然已经有一个issue在Foundation GitHub上提交了这个，并且只要它没有固定就提出了相同的解决方法 .
回复于 2024-05-02T12:51:10+08:00
0
问题似乎是身体类变得“固定”我用一些简单的CSS修补了我的身体
```
body.fixed { position:static !important}
```
回复于 2024-05-02T12:51:10+08:00

Zurb Foundation Offcanvas菜单在以编程方式切换后停止工作

2 回答

相关问题