当幻灯片自动播放时,向外部导航添加类:
Add class to external navigation when slide auto-play happens : anythingSlider
我的anythingSlider是这样的
<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>
添加一个类(对于下一张幻灯片也是如此),以便我可以将其显示为选中的。有谁能指出正确的做法吗?JsFiddle
AnythingSlider Wiki就是你想要的例子:
自定义,外部导航控件(更新"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; });
演示:http://jsfiddle.net/Mottie/ycUB6/76/
相关文章:
- 使用数据幻灯片到和javascript将类添加到转盘导航
- 如何将jQuery文件添加到导航网站
- 使用 jQuery 添加键盘导航
- JQuery,引导导航 - 如何添加上一个/下一个按钮
- 单击“下一个”和“上一个”时,如何从导航菜单中添加和删除类
- 将鼠标导航添加到IDD图形中
- 在导航菜单中添加类
- 添加CSS3转换浮动导航栏-JQUERY
- 在我的玉石模板中添加导航栏
- Jquery-如何将活动类添加到整个导航菜单路径中
- 如何在引导程序中添加菜单来切换导航栏
- 向选项卡导航添加动画
- 将第二个子导航添加到手风琴样式菜单中
- 将左右箭头导航添加到“;李id”;要素
- Chrome中的错误&Safari在向下滚动时向导航添加一个粘性固定类,使其滚动到顶部
- 将箭头键导航添加到页面中带有变量的站点
- 引导3定心导航添加5像素的底部的链接
- 在用户滚动时为链接中的导航添加活动状态
- Wordpress导航添加/移除类不工作
- 当幻灯片自动播放时,向外部导航添加类: