滚动到顶部，动画滚动到#page链接冲突

Question

因此，对于javascript来说，我还是一个新手，他正在建立一个网站，试图在页面上制作动画滚动。

要启用动画滚动到链接，我正在使用以下代码：

jQuery(document).ready(function ($) {
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

         var target = this.hash,
         $target = $(target);

         $('html, body').stop().animate({
             'scrollTop': $target.offset().top
         }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
})();

要滚动到页面顶部，我正在使用此代码。

//<-- scroll top -->

var $top = jQuery.noConflict();
$top("#scroll-top").hide();

// fade in #scroll-top
$top(window).scroll(function () {
    if ($top(this).scrollTop() > 150) {
        $top('#scroll-top').fadeIn();
    } else {
        $top('#scroll-top').fadeOut();
    }
});

// scroll body to 0px on click
$top('#scroll-top a').click(function () {
    $top('body,html').animate({
        scrollTop: 0
    }, 800);
    return false;
});

他们俩都可以独立工作，但不能一起工作。 谁能帮助我找出他们为什么冲突以及如何解决冲突？

Answer 1

因此，这就是我解决问题的方式：

我删除了有冲突的代码“ //单击时将正文滚动到0px”，而是使用动画滚动来锚定链接以使这两个功能动起来，同时也将其置于页面顶部。

jQuery(document).ready(function ($) {
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

         var target = this.hash,
         $target = $(target);

         $('html, body').stop().animate({
             'scrollTop': $target.offset().top
         }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
})();

我工作正常，但我只缺少一个功能，即JavaScript可以识别以＃以外的其他内容开头的内部链接。 现在，它无法识别例如此链接http://julebord.bedriftsdesign.no/julebord.html#julemeny 。 仅在使用以下命令时有效：#julemeny