Question

这两个功能都是独立工作的，但我不确定他们为什么不能一起工作。目前，代码中排在第二位的功能是主要功能，它将在另一个功能被禁用时运行。

  function scrollToAnchor(aid){
    var aTag = $("a[name='"+ aid +"']");
    $('html,body').animate({scrollTop: aTag.offset().top-135},'slow');
  }

  $("a").click(function() {
    var href = $(this).attr('href').replace('#', '')
    scrollToAnchor(href);
});

和第二个脚本：

function openProject(href) {
    //remove existing content
    if ($("#contentBox").is(":visible")) {
        $("#contentBox").animate({
            height: "0"
        }).empty();
    }
    $("#contentBox").load("projects.html " + href, function () {
        //create map
        var mapLat = $(this).find(".map-canvas .lat").text();
        var mapLon = $(this).find(".map-canvas .lon").text();
        var mapOptions = {
            center: new google.maps.LatLng(mapLat, mapLon),
            disableDefaultUI: true,
            zoom: 16
        };
        var map = new google.maps.Map($(this).find(".map-canvas")[0], mapOptions);
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(mapLat, mapLon),
            map: map
        });
        //create slideshow
        var slides = $(this).find(".flexslider");
        if (slides.length) {
            slides.flexslider();
        }
        //open
        var contentBoxHeight = $(this).css("height", "950px").height();
        $(this).css("height", "0");
        $("#contentBox").animate({
            height: contentBoxHeight
        });
        var headerHeight = 135;
        $("html, body").animate({
            scrollTop: $(this).offset().top - headerHeight
        });

        $(".close").on("click", function (e) {
            $("#contentBox").empty();
            $("#contentBox").animate({
                height: 0
            });
        });
    });
}
});

Answer 1

好的我明白了。第二个链接标记需要一个类，以便函数不会相互覆盖。将“a”更改为“a.linkNav”

<!-- Scroll to Anchor -->
<script> 
 function scrollToAnchor(aid){
   var aTag = $("a[name='"+ aid +"']");
   $('html,body').animate({scrollTop: aTag.offset().top-135},'slow');
 }

  $("a.linkNav").click(function() {
    var href = $(this).attr('href').replace('#', '')
    scrollToAnchor(href);
});  
</script>

两个竞争滚动到同一页面html页面中的锚点功能

1 个答案: