3

メニュー項目がクリックされた後にキャンバス外のメニューを自動的に閉じる方法を探していましたが、何も機能していないようです。

そのため、Foundation 6 ドキュメントのキャンバス外メニューの作成方法に関するガイドに従いましたが、うまくいきました。この部分は大丈夫です。リンクメニューをクリックすると、そこにとどまり、閉じたいと思います。誰でもそれを修正する方法を知っていますか。

トリックを実行するスニペットを見つけましたが、この JS を適用した後、メニューが表示されなくなります。他の人も同じ問題を報告しています。

$(document).foundation({
  offcanvas : {
    open_method: 'move', // Sets method in which offcanvas opens, can also be 'overlap'
    close_on_click : true
  }
});

ここにドキュメントがありますが、私は JavaScript についてあまり知らないので、誰かに正しいコードを書いてもらいます。

4

2 に答える 2

9

リンクがクリックされたときcloseに、メニューでメソッドを使用できます。.off-canvas

$('.off-canvas a').on('click', function() {
    $('.off-canvas').foundation('close');
});

ここをクリックしてデモをご覧ください。

于 2016-03-12T10:17:56.180 に答える
1

事前に、下手な英語で申し訳ありませんが、

それを理解するためにオンラインで調べるだけで、最終的に、Yass が提供した上記のスクリプトが機能します。しかし、Slick スライダー スクリプトを挿入すると、機能しなくなりました。

私は自分に合った解決策を見つけましたが、バグがあるかもしれません。

以下に示すように、foundation offcanvas ドキュメント内に、キャンバスを閉じるための閉じるボタンが表示されます。

<button class="close-button" aria-label="Close menu" type="button" data-close>
    <span aria-hidden="true">&times;</span>
</button>

だから私はそれを適応させ、「data-close」をリンクに配置しました。クリックすると、特定の div までスクロールしてキャンバスを閉じます

そして、ここにもっと理解するためのリンクがありますか? 私の説明が下手だと思うから

https://jsfiddle.net/mbsj7d7p/

于 2016-04-28T10:57:01.033 に答える