2

这是小提琴：http: //jsfiddle.net/Ywq8G/

我想知道是否有人能告诉我：为什么 menu1 在单击子菜单（绿色的）后闪烁，其他两个工作正常，但调试让我无处可去，我想：所以已经给了我这么多答案（只需阅读）我可以贡献并提出我的具体问题。

我希望该解决方案能让我成为一个更好的开发人员，并帮助其他人避免我遇到的问题。

var MENU_HEIGHT = 110; 


$(document).ready(function () { 
    var menuCollection = {}
    var i = 1;
    $(".menu").children().each(function () {
        menuCollection[i] = [];
        $(".subMenu" + i).children().each(function () {
            menuCollection[i].push(this);
        });
        i++;
    });

    function scroll(menu, item, status) {
        if (item < menu.length) {
            var currentChild = menu[item];
            if (status == "scrollOut") {
                $(currentChild).stop().animate({
                    top: MENU_HEIGHT + 80 * item
                }, {
                    queue: false,
                    duration: 600
                }) {
                    scroll(menu, item + 1, status);
                };
            } else {
                $(currentChild).stop().animate({
                    top: 0
                }, {
                    queue: false,
                    duration: 600
                }) {
                    scroll(menu, item + 1, status);
                };
            }
        }
    }
    var ii = 1;
    $(".menu").children().each(function () {
        var target = $(this).attr('class');
        var menu = menuCollection[ii];

        $("." + target + ", .subMenu" + ii + " > a").bind("mouseover", function () {
            doScroll(menu, 0, "scrollOut");
        });
        $("." + target + ", .subMenu" + ii + " > a").bind("mouseout", function () {
            doScroll(menu, 0, "scrollIn");
        });
        ii++;
    });


    function doScroll(menu, item, status) {
        scroll(menu, item, status);
    }

    $("a").click(function (event) {
        var href = $(this).attr('href');
        href = href.substring(1);

        $(".current").appendTo(".hidden");
        $(".current").removeClass("current");


        $("." + href).addClass("current");
        $("." + href).appendTo(".main");

        $('html, body').animate({
            scrollTop: $(".main").offset().top
        }, 600);
    });
});
4

1 回答 1

0

闪烁是因为您使用带有“#”的标签的 href 参数，并且当您单击它时，浏览器会将窗口移动到 ID 为 #-value 的元素。如果你有很多内容要改变浏览器首先跳转到这个 id 然后使用你的 $('html, body').animate({...}) 函数（所以再次跳转到顶部并动画到向下）。

例如，您可以将“href”更改为“myHref”（在 html 和 js 中），它应该可以解决问题。

（对不起我的英语，我希望是可以理解的）

于 2013-09-02T20:17:29.847 回答