html 折叠菜单不适用于锚链接

s2j5cfk0 于 2022-12-02 发布在其他

关注(0)|答案(1)|浏览(158)

我已经建立了一个菜单，当你从顶部向下滚动超过250px时，菜单会折叠，当你回到顶部时，菜单会恢复到原来的状态。但是我的网站有一些链接到主页中间的锚点链接。当我直接进入这些链接时，菜单不起作用。我必须先滚动。这是解决这个问题的一种方法吗？
这是我使用的代码：

<script>
    jQuery(function () {
        jQuery('.fixed').data('size', 'big');
    });

    jQuery(window).scroll(function () {
        if (jQuery(window).scrollTop() > 250) {
            if (jQuery('.fixed').data('size') == 'big') {
                jQuery('.fixed').data('size', 'small');
                jQuery('.fixed').stop().animate({
                    top: '-125px'
                }, 600);
                jQuery('.navbar-nav').stop().animate({
                    top: '15px'
                }, 600);
                jQuery('.dmbs-header-img').stop().animate({
                    opacity: '0'
                }, 200);
                jQuery('.logo-simple').stop().delay(200).animate({
                    top: '120px'
                }, 600);

            }
        } else {
            if (jQuery('.fixed').data('size') == 'small') {
                jQuery('.fixed').data('size', 'big');
                jQuery('.fixed').stop().animate({
                    top: '0px'
                }, 200);
                jQuery('.navbar-nav').stop().animate({
                    top: '0px'
                }, 200);
                jQuery('.dmbs-header-img').stop().animate({
                    opacity: '1'
                }, 100);
                jQuery('.logo-simple').stop().animate({
                    top: '-50px'
                }, 200);
            }
        }
    });
</script>

Html

来源：https://stackoverflow.com/questions/31938274/collapse-menu-not-working-with-anchor-links

1条答案

按热度按时间

olmpazwi1#

只需在锚单击时触发滚动事件（或您需要的任何其他事件）。

jQuery('a').click(function(){
    jQuery(window).scroll();
});

或

将代码移动到函数中，并在滚动或锚单击时调用它：

function checkScroll(){
    if(jQuery(window).scrollTop() > 250)
    {
        // Your code
    }
    else
    {
        // Your code
    }
}

jQuery(window).scroll(function(){ 
    checkScroll();
});

jQuery('a').click(function(){
    checkScroll();
});

第二种解决方案可能会给予你更多的灵活性。

赞(0）回复(0）举报 2022-12-02

我来回答

html 折叠菜单不适用于锚链接

1条答案

相关问题

热门标签

最新问答