Jquery封装tab自动切换效果的具体实现

2020-05-16 18:42:45易采站长站整理

1 function tabSlider(obj,count){} 用这个js来封装后传入参数!当在HTML页面上时直接调用tabSlider(obj,count)就可以了!
2 初始化一些参数 然后给这个函数自生自定义一个函数this.slider = function(){} 绑定个mouseover事件,初始化第一个li时 查找当前的div内容是否和当前li 指向同一个指针 如果相同 那块内容显示!其他的隐藏!
3 自定义this.addHover这个事件  当鼠标移上时候抽发这个事件!
4 自定义自动播放事件this.autoplay = function(){} 这个里面用了trigger这个触发方法_this.n = _this.n >=(_this.count-1)? 0 : ++_this.n;
   $(_this.obj + ” .menu li”).eq(_this.n).trigger(“mouseover”);
5 最后用个函数 来渲染上面的函数 调用上面的函数

this.factory = function(){
   this.slider();
   this.addhover();
   t = setInterval(this.autoplay,_this.time);
  }
  this.factory();