在使用导航箭头时突出显示链接

我在这里有一个类似于其他人的问题，但这些问题没有帮助，因为他们提到列表链接，而这些不是列表。在使用导航箭头时突出显示链接

我有一个水平滑动的网站。当您点击顶部的链接时，它们会根据它所滑动的页面进行高亮显示。但是，如果您使用左右导航箭头，则链接不会正确突出显示。它只是在点击的最后一个链接上保持突出显示。如果有人能告诉我我做错了什么，我很想知道。即使使用导航箭头，我也希望正确的链接被突出显示。

这里是的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

在使用导航箭头时突出显示链接

回答

相关问题