我在我的网站中使用 Anything slider ,希望向控件添加单击事件。 这可能吗?当我尝试执行此操作时,我的事件没有触发。有人对此有什么想法吗?
我的点击事件详细信息:
$(function(){
$('.thumbNav li a').click(function () {
$(".spec li a").css('color','#fff');
});
});
fiddle 链接 jsfiddle.net/Mottie/ycUB6/5340
最佳答案
您的代码无法正常工作的原因是导航控件在 AnythingSlider 初始化之后才存在。所以,你确实有两个选择:
1) 在 onInitialized
回调函数 ( demo ) 中使用您的函数:
var tabContainers = $('div.spec-nav > div');
tabContainers.hide().filter(':first').show();
$(function () {
$('#slider1, #slider2, #slider3').anythingSlider({
theme: 'metallic',
easing: 'easeInOutBack',
navigationFormatter: function (index, panel) {
return ['Slab', 'Parking Lot', 'Drive', 'Glorius Dawn', 'Bjork?', 'Traffic Circle'][index - 1];
},
// Callback when the plugin finished initializing
onInitialized: function (e, slider) {
$('div.spec-nav ul li a').click(function () {
tabContainers.hide();
tabContainers.filter(this.hash).show();
$('div.spec-nav ul li a').removeClass('spec-actv');
$(this).addClass('spec-actv');
return false;
}).filter(':first').click();
},
onSlideComplete: function (slider) {
// alert('Welcome to Slide #' + slider.currentPage);
}
});
});
2) 在创建导航选项卡时构建此功能...如果您查看navigationFormatter
documentation ,您将看到可以返回选项卡的任何属性;这使用 jQuery()
method创建 DOM 元素。
$('#slider').anythingSlider({
navigationFormatter : function(i, panel){
return {
'class' : 'imatab',
'data-hdr' : 'Header: ' + panel.find('h2').text(), // save text from the h2 in the panel
'title' : 'This text will end up in a tooltip',
'html' : '<a class="panel' + i + '" href="#"><span>' + ['Cat', 'Dog', 'Bear', 'Wolf', 'Horse', 'Bjork?'][index - 1] + '</span></a>',
'click' : function(){ alert("AHHH I've been clicked"); }
};
}
});
如果您使用的是 jQuery 1.8+,您可以传递任何 jQuery 实例方法,如下所示:
$('#slider').anythingSlider({
navigationFormatter : function(i, panel){
return {
class : 'imatab',
on : {
click : function( event ) {
// do something
}
},
html : '<a class="panel' + i + '" href="#"><span>' + i + '</span></a>'
}
}
});
我没有为这个方法制作演示,但我希望你能明白。
关于javascript - 是否可以向任何 slider 控件添加单击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16012544/