发生幻灯片自动播放时，将类添加到外部导航：_JavaScript

我的一切滑块看起来像这样

<link rel="stylesheet" href="http://css-tricks.github.com/AnythingSlider/css/theme-metallic.css">

<div id="externalNav">
Goto <a href="#1">One</a> |
     <a href="#2">Two</a> |
     <a href="#3">Three</a> |
     <a href="#4">Four</a>
</div>

<br><br>

<ul id="slider">
    <li><img src="http://placekitten.com/300/200" alt="" /></li>
    <li><img src="http://placehold.it/300x200" alt="" /></li>
    <li><img src="http://placebear.com/300/200" alt="" /></li>
    <li><img src="http://lorempixel.com/300/200" alt="" /></li>
    <li><img src="http://placedog.com/300/200" alt="" /></li>
</ul>

    $('#slider').anythingSlider({
    // If true, builds a list of anchor links to link to each panel
    buildNavigation: false,
    autoPlay: true
});

当发生自动播放并且第一张幻灯片处于活动状态时，我想向<a href="#1">One</a>添加一个类（下一张幻灯片以此类推），以便我可以将其显示为选中状态。 谁能指出实现此目的的正确方法是什么？

只是您想要的示例：

自定义外部导航控件（带有更新的“ cur”类）

 var nav = $('#externalNav a'), updateNav = function(page){ nav .removeClass('cur') .eq(page).addClass('cur'); } $('#slider').anythingSlider({ // If true, builds a list of anchor links to link to each panel buildNavigation: false, onInitialized: function(e, slider) { updateNav(slider.currentPage-1); }, // Callback before slide animates onSlideBegin: function(e, slider) { updateNav(slider.targetPage-1); } }); // set up external links nav.click(function(){ var slide = $(this).attr('href').substring(1); $('#slider').anythingSlider(slide); return false; });

演示： :

发生幻灯片自动播放时，将类添加到外部导航：

问题描述

1楼