ヘッダーにメイン ナビゲーションがあり、フッター ナビゲーションがあります。しかし、ヘッダーにはメイン ナビゲーションのみを表示し、フッター ナビゲーションには出力します。しかし、フッター ナビゲーションを出すと、メイン ナビゲーションがフッター ナビゲーションに関連しているため、メイン ナビゲーションの「赤い線」のホバー効果が機能せず、何が問題なのかわかりません..
ここに私のテストサイト:
http://topkosmetikstudios.de/release/index.php?article_id=1
ここに私のJavaScriptコード:
function header_menu_line() {
"use strict";
var $el, leftPos, newWidth;
$("#magic-line").remove();
$("#main_menu").append("<li id='magic-line'></li>");
var $magicLine = $("#magic-line");
$magicLine
.width($(".current_menu_ancestor").width())
.css("left", $(".current_menu_ancestor a").position().left)
.data("origLeft", $magicLine.position().left)
.data("origWidth", $magicLine.width());
$("#main_menu > li").hover(function() {
$el = $(this).find("a");
leftPos = $el.position().left;
newWidth = $el.parent().width();
$magicLine.stop().animate({
left: leftPos,
width: newWidth
}, 300);
}, function() {
$magicLine.stop().animate({
left: $magicLine.data("origLeft"),
width: $magicLine.data("origWidth")
}, 300);
});
}