/ ドリルダウンメニューのカスタムテキスト「戻る」ボタン[Foundation 6] - zurb-foundation、zurb-foundation-6

ドリルダウンメニューのカスタムテキスト「戻る」ボタン[Foundation 6] - zurb-foundation、zurb-foundation-6

私が知っている間、私は データバックボタン ドリルダウンメニューのテキストを変更するには、ドリルダウンの親が何であるかを反映するように変更することは可能ですか?

たとえば、ドリルダウンメニューは次のように機能します。 例1

そして私はそのように機能するのが好きです: 例2

私はこれが意味をなさないことを願って、私が明確にできるかどうかを私に知らせてください。あなたが提供できるどんな洞察にも感謝します。

回答:

回答№1は5

あなたがこれをすることができる方法のいくつかがありますが、最も簡単なことは私にこのようなものであるようです:

1)使用 基礎掘削オプション 新しい一般戻るボタンを設定します。例えば data-back-button="<li class="js-drilldown-back"><a class="new-back"></a></li>"

これは、 .js-drilldown-back 追加のJavaScriptを使用せずに戻るボタンとして機能させます。また、新しいクラスを a 後でテキストを設定するために使用します。

2)テキストを変更するには、次のようなjQueryを使用します。

$(".new-back").each(function(){
var backTxt = $(this).parent().closest(".is-drilldown-submenu-parent").find("> a").text();
$(this).text(backTxt);
});

これは、元のリンクテキストが何であるかを調べるためにメニュー構造をスクロールし、それを新しい戻るボタンにコピーすることです。

これは、この例のようにドリルダウンのすべてのレベルで機能するはずです。 http://codepen.io/tymothytym/pen/GWbXap

参考: 同じラベルをメニューの前後に向けて使用することで、ユーザがこれを混乱させることが特に多くのレベルで分かるので、ユーザビリティに関するいくつかの懸念事項があります。あなたはすでにこれを考慮しているかもしれませんが、私は完全性のためだけに言及します。