[英]red line hover effect on navigation javascript
我在页眉和页脚导航上有一个主导航。 但是我只会在页眉和页脚导航上放置主要导航。 但是,如果推出页脚导航,则主导航“红线”悬停效果将不起作用,因为主导航与页脚导航有关,我不知道出了什么问题。
这是我的测试站点:
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);
});
}
我会检查您定位到.current_menu_ancestor的位置,也在页脚中使用该类,并且您没有针对页眉专门定位; 可能有东西扔了。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.