[原创]修改jquery.slideBox.js插件 自定义部分事件

项目中对于首页中的图片切换展示需要修改部分功能,而使用的是jquery.slideBox插件

修改:让右下角的按钮点击不会跳转页面,只是切换图片

插件中会先

var lis = ul.find('li');//获取右下角的圆圈

然后会去遍历此dom集合

lis.each(function(i,n){//.<关键代码>..对每个按钮添加样式或者触发事件})

在上面这个遍历函数中会有

$('<a>').attr('href', href).text(text).addClass(css).css('borderRadius', settings.clickBarRadius+'px').mouseover(function(){wrapper.data('over', 1);$(this).addClass('active').siblings().removeClass('active');ul.find('li:eq('+$(this).index()+')').addClass('active').siblings().removeClass('active');start();}).appendTo(nums);

这样的处理,我在这里全部注释,自定义添加样式和事件

var style = {'borderRadius':settings.clickBarRadius+'px','border': '2px solid','background-color': '#C3C8CF','width': '10px','height': '10px','display': 'inline-block','margin-top': '14px','text-align': 'center',/*'color': 'white',*/'margin-right': '6px','cursor': 'pointer'}var index = i+1;$('<span>').attr('href', href).addClass(css).css(style).click(function(){wrapper.data('over', 1);$(this).addClass('active').siblings().removeClass('active');ul.find('li:eq('+$(this).index()+')').addClass('active').siblings().removeClass('active');start();}).appendTo(nums);

这样,右下角的按钮点击就只能切换图片而不会跳转了.