簡體   English   中英

頁面中的鏈接不起作用

[英]Links in page don't work

我在一頁的鏈接有問題。 當我想要向下滾動時它工作,但是當我想要向上滾動時它保持在同一個地方。 這是代碼的一部分:

(function($){
/* Store the original positions */
var d1 = $('.one');
var d1orgtop = d1.position().top;
var d2 = $('.two');
var d2orgtop = d2.position().top;
var d3 = $('.three');
var d3orgtop = d3.position().top;
var d4 = $('.four');
var d4orgtop = d4.position().top;

/* respond to the scroll event */
$(window).scroll(function(){
    /* get the current scroll position */
    var st = $(window).scrollTop();

    /* change classes based on section positions */
    if (st >= d1orgtop) {
        d1.addClass('latched');
    } else {
        d1.removeClass('latched');
    }
    if (st >= d2orgtop) {
        d2.addClass('latched');
    } else {
        d2.removeClass('latched');
    }
    if (st >= d3orgtop) {
        d3.addClass('latched');
    } else {
        d3.removeClass('latched');
    }
    if (st >= d4orgtop) {
        d4.addClass('latched');
    } else {
        d4.removeClass('latched');
    }
});

以及JSFIDDLE JSFIDDLE中的示例

當我點擊頁面頂部的href時,它向下滾動。 但當我點擊底部的href時,沒有任何反應。 我的錯在哪里?

DEMO

因為你的風格position:fixed.latched類。 您刪除它,你修復它,但是它根據我的可視化效果影響原始功能。 所以作為一種替代方案,我有jquery hack,它實際上是按照要求運行的。

$('a[href="#intro"]').on('click',function(){
  $(d1,d2,d3,d4).removeClass('latched');  
  //on click of #intro element you just remove latched class from all the elements
})

我有一個類似的問題,由於其他一些原因,我使用了一個函數來設置滾動到頁面。

我已經用你的例子測試過並且工作正常,請看小提琴: https//jsfiddle.net/nft4oeab/3/

功能是:

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

希望能幫助到你。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM