在使用導航箭頭時突出顯示鏈接

我在這裏有一個類似於其他人的問題，但這些問題沒有幫助，因爲他們提到列表鏈接，而這些不是列表。在使用導航箭頭時突出顯示鏈接

我有一個水平滑動的網站。當您點擊頂部的鏈接時，它們會根據它所滑動的頁面進行高亮顯示。但是，如果您使用左右導航箭頭，則鏈接不會正確突出顯示。它只是在點擊的最後一個鏈接上保持突出顯示。如果有人能告訴我我做錯了什麼，我很想知道。即使使用導航箭頭，我也希望正確的鏈接被突出顯示。

這裏是的jsfiddle腳本：http://jsfiddle.net/LD9YS/13/

這裏是我的失敗嘗試之一...（請不要揣摩什麼，我在這裏做什麼？我有沒有這方面的想法我自己）

$(".arrow-right").click(function(){ 
    prevA.removeClass("active"); 
    prevA = $(A[index]).addClass("active"); 
});

這很痛苦，很明顯，我沒有第一個線索如何做到這一點，但至少我給了它幾次嘗試。我想表現出更多的嘗試，但他們如此愚蠢，以至於我甚至不記得我在這些方面做了什麼。

有人可以幫忙嗎？如果有人不能幫助，我準備放棄它。

來源

2014-07-01 user2284703

你會做到這一點，像這樣

$('.arrow-left').on('click', function (e) { 
    e.preventDefault(); 
    $('.tabs .active').prev().trigger('mousedown'); 
}); 

$('.arrow-right').on('click', function (e) { 
    e.preventDefault(); 
    $('.tabs .active').next().trigger('mousedown'); 
});

FIDDLE

來源

2014-07-01 20:31:49 adeneo

工程很好，但有一個小問題。當它到達最後一個鏈接（第5頁），並且您繼續單擊它時，突出顯示會一直循環，但頁面會保留在第5頁上。爲了澄清，我設置了它以便頁面不會循環返回到第一頁。我希望它停止在5. – user2284703

@ user2284703 - 這是沒有問題的，編輯代碼 – adeneo

你ROCK！如果我見過一個真正的專業人士。非常感謝！奇蹟般有效。 – user2284703

這將爲右箭頭工作...

$('.arrow-left').on('click', function(e){ 
    e.preventDefault() 
    var current = $('.tabs').find('a.active').index(); 
     if(current!= $('.tabs').find('a:first').index()){ 
     $('.tabs a').removeClass('active'); 
      $('.tabs a').eq(current-1).addClass('active'); 
     } 
    mySwiper.swipePrev() 
    })

同爲左箭頭

$('.arrow-right').on('click', function(e){ 
    e.preventDefault() 
    var current = $('.tabs').find('a.active').index(); 
     if(current!= $('.tabs').find('a:last').index()){ 
     $('.tabs a').removeClass('active'); 
      $('.tabs a').eq(current+1).addClass('active'); 
     } 
mySwiper.swipeNext() 
})

來源

2014-07-01 20:35:29 luchosrock

這段代碼在使用時只是搞亂了我所有的頁面。我有每個部分（頁面）都顯示一個iframe，但是此代碼只是將所有這些內容放入一個頁面中的一行中並排放置在一個小的iframe中。不過謝謝。欣賞時間來協助。 – user2284703

@ user2284703也許我忘了在塊的末尾加入''''。現在我編輯了它，但我很高興你找到了你的答案。 – luchosrock

這是什麼你應該這樣做：

$('.arrow-left').on('click', function(e){ 
    e.preventDefault(); 
    mySwiper.swipePrev(); 
    $(".tabs .active").removeClass('active'); 
    $($('.tabs a')[mySwiper.activeIndex]).addClass('active'); 
    }) 

    $('.arrow-right').on('click', function(e){ 
    e.preventDefault(); 
    mySwiper.swipeNext(); 
    $(".tabs .active").removeClass('active'); 
    $($('.tabs a')[mySwiper.activeIndex]).addClass('active'); 
    })

來源

2014-07-01 20:39:54

在使用導航箭頭時突出顯示鏈接

回答

相關問題