タブを使用して各メニュー項目の特定のコンテンツを表示するドロップダウン メニューを作成しました。
これは、タブ機能に使用した jQuery チュートリアルへのリンクです: http://www.jacklmoore.com/notes/jquery-tabs
ニーズに合わせてコードを修正しましたが、「アクティブ」クラスも適用されている要素を変更する方法を見つけるのに苦労しています。CSS のスタイリング上の理由から、「アクティブな」クラスを、現在追加されているの親<li>
にも適用したいと考えています。<a>
.parent();
メソッドを含むさまざまなソリューションを試しましたが、役に立ちませんでした。ここでのアドバイスは大歓迎です。
クラスの追加を処理するコードの簡単なスニペットを次に示します。
// Keep track of which tab is active and it's associated content
var $active, $content, $links = $(this).find('li.activate-dropdown a');
// If the location.hash matches one of the links, use that as the active tab.
$active = $($links.filter('[rel="'+location.hash+'"]')[0]);
$active.addClass('active');
$content = $($active.attr('rel'));
編集: ライブ コードの例 - http://jsfiddle.net/jgfg7/3/