问题标签 [off-canvas-menu]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1104 浏览

javascript - 在模块中导入 jQuery 插件

我正在尝试使用 npm 导入 jQuery 插件(js-offcanvas),但我不断收到相同的错误:

app.js 文件:

html文件:

我不确定我是否做错了什么。

更新 这是我的 brunch-config.js 文件:

0 投票
0 回答
451 浏览

css - CSS Off canvas nav 移除固定顶部

我的 CSS 只有在画布导航中才能工作滚动。导航适用于台式机、平板电脑和移动设备。问题是我不希望它再被固定在顶部。

当我删除“位置:固定”时,它给了我一系列位置问题,双滚动条和导航菜单不再正常工作。

我错过或忽略了这个问题?

我的片段:

0 投票
0 回答
79 浏览

zurb-foundation - 画布外 .position-top 在中等向下,.position-left 在大?[基础6.4.3]

基本上就是标题所说的。是否可以将画布放在小/中的顶部,然后将其放置在大的左侧?

我原以为这会成功:

HTML

SCSS

但随后画布外的画面消失了。感谢您提供的任何见解。

0 投票
1 回答
1182 浏览

css - 画布外菜单动画不起作用

我有一个用 Bootstrap 制作的 3 列模板,我正试图正确地制作动画。我确定我错过了一些简单的东西,但无法弄清楚并且可以使用一些反馈。我只是想通过滑入使左侧的画布菜单动画化。我尝试过弄乱每个 div 并对其进行动画处理,但它仍然不会动画化。我尝试在网上搜索,但找不到任何可能对我有帮助的东西。我很感激任何建议。HTML

CSS

JS

0 投票
1 回答
262 浏览

zurb-foundation - Foundation 6.4.3 画布外容器

我遵循了画布外使用的文档,但它根本不起作用。403当我尝试在 theri 论坛上创建帖子时,F6 论坛返回:(。

这是我尝试的 HTML 代码:

只显示“欢迎”,没有画布外。我在这里做错了什么?谢谢。

0 投票
1 回答
1884 浏览

css - Bootstrap 4 关闭画布菜单不工作 iOS Safari

我正在尝试使用 Bootstrap 4 关闭画布菜单,如本示例所示- 在 iOS 10.3 Safari 中,关闭时菜单被隐藏,但随后打开而不是向左滑动只是部分方式 - 屏幕抓取显示它打开。适用于 Mac Safari 和 windows 浏览器。

我在 caniuse 中查找了大部分 CSS,对于我的 Safari 来说一切似乎都很好。

下面的代码(示例的精简版)

在此处输入图像描述

HTML

CSS

JQUERY $(function () { '使用严格'

0 投票
0 回答
40 浏览

javascript - 画布外菜单基础 6 画布内

我发现自己在使用foundation 6 的画布外菜单时遇到了一个相当特殊的问题。确实,在我们通过中等屏幕的情况下,可以将其设置为画布内。不幸的是,画布内系统确实是重叠的,我希望在小屏幕上将其推送。

可能吗 ?

对于此处显示的示例是链接

很抱歉直接在stackoverflow上提问,但是我不能在基金会的论坛上提问,我的帖子没有发布,我仍然没有关于这个主题的zurb支持的消息。

0 投票
0 回答
80 浏览

wordpress - 基础框架画布外菜单未打开

在以下开发站点上,画布外菜单未触发。

http://pgoutfittersv2.staging.wpengine.com/

该站点正在使用带有 JointsWP 主题的 WordPress。

我收到与 Foundation JS 文件相关的控制台错误,但我不知道它是什么意思或相关。

有任何想法吗?

0 投票
2 回答
2795 浏览

angular - 角度 4 中的 Bootstrap Offcanvas 示例

我是 Angular 的新开发者,我正在尝试在我的应用程序中复制这个引导导航栏 示例。问题是当我将导航栏传递给角度时,导航栏的响应不起作用。我安装了所有必要的依赖项以使其正常工作,但它不起作用,我不明白为什么。

这是一个完美运行的示例,但它是在不使用 Angular 的情况下构建的:

但是当我将此代码转换为角度时,它不起作用。我认为发现差异的具体部分是:

我的问题是这部分如何转化为角度?

0 投票
1 回答
292 浏览

javascript - 需要帮助 w/ Off-Canvas Flexbox 菜单切换 / z-index

更新

通过将以下内容添加到“站点菜单”和“容器”样式中,我能够将侧面导航项目堆叠起来:

唯一剩下的就是让内容根据单击的选项卡正确切换。

原帖

我正在使用 flexbox 和Off-Canvas 菜单教程来创建一个可悬停的侧导航菜单。

当按下选项卡时,我希望该弹性项目滑到屏幕上并位于最前面。我可以滑动到屏幕上,这是导致问题的堆叠顺序。如何更改弹性项目的堆叠顺序或根据单击的选项卡在显示的内容之间切换?该图像应有助于澄清:

图像 - 关闭画布菜单的 Flexbox

这是我目前为该网站工作的链接: LINK

我已经看到使用 css 和 javascript 更改堆叠顺序的示例,但我无法完全连接如何使其与 flexbox 项目一起使用。

CSS

HTML

Javascript

任何指导将不胜感激。