jQuery插件superslide.js源码片段分析记录

    	//b为页面给slide()传参的对象{}
        return a.fn.slide.defaults = {
            type: "slide",//效果类型,可选"slide"||"menu",引入type:"menu"专门处理菜单/导航效果
            effect: "fade",//v1.0] fade:渐显; || top:上滚动;|| left:左滚动;|| topLoop:上循环滚动;|| leftLoop:左循环滚动;|| topMarquee:上无缝循环滚动;|| leftMarquee:左无缝循环滚动;fold:淡入淡出  slideDown:下拉效果
            autoPlay: !1,
            delayTime: 500,//切换时间长度,单位毫秒,影响的是下面tab-content内容显示处理的时间长段
            interTime: 2500,//自动切换时,允许时间间隔
            triggerTime: 150,//触发titCell时,过多久执行操作,单位毫秒
            defaultIndex: 0,//默认索引,在未设置active状态即未设置titOnClassName在titCell元素上时,默认添加该类
            titCell: ".hd li",//导航元素对象(鼠标的触发元素对象)
            mainCell: ".bd",//切换内容的包裹层,不能直接是内容元素,需要一级父元素;切换元素的包裹层对象
            targetCell: null,//当mainCell不能选择到内容时,可以使用targetCell代替
            trigger: "mouseover",
            scroll: 1,//每次滚动个数
            vis: 1,//visible缩写,mainCell的可视范围个数,当实际内容个数少于可视个数的时候,不执行SuperSlide效果。
            titOnClassName: "active",//当前titCell位置自动增加的class名称
            autoPage: !1,
            prevCell: ".prev",
            nextCell: ".next",
            pageStateCell: ".pageState",//分页状态对象,用于显示分页状态,例如:2/3
            opp: !1,//默认反方向运动,例如 effect:"leftMarquee" 然后设置 opp:true,则效果为右滚动。常用于leftMarquee/topMarquee
            pnLoop: !0,//前/后按钮是否继续循环,若为false则当翻动到最前/后页时,前/后按钮点击无效,同时增加prevStop/nextStop类名控制样色
            easing: "swing",//缓动效果;[v2.1]更改默认效果为“swing”,使效果更流畅
            startFun: null,//每次切换效果开始时执行函数,用于处理特殊情况或创建更多效果。用法 startFun:function(i,c){ }; 其中i为当前分页,c为总页数[v2.1]增加传递参数,startFun:function( i, c, slider, titCell, mainCell, targetCell, prevCell, nextCell ){},这样简写就方便了。例如 jQuery(".slideBox").slide({ startFun:function( i,c,s ){ s.show() } }); 这里的 s.show() 相当于 jQuery(".slideBox").show()
            endFun: null,//每次切换效果结束时执行函数,用法和startFun一致
            switchLoad: null,//切换tab时,实时加载真实图片路径,该值为存储真实图片地址的属性名称(自定义)
            playStateCell: ".playState",//播放/暂停状态按钮,点击后会增加/删除"pauseState"类名用于控制样色。可参考 [2.22-真·全屏焦点图]
            mouseOverStop: !0,//鼠标移到容器层(无缝滚动是mainCell)是否停止播放
            defaultPlay: !0,//默认是否执行效果(第一次运行是否执行效果)常用于导航/菜单
            returnDefault: !1//鼠标移出容器,是否返回默认状态,常用于导航/菜单
        },//this为调用slide的元素
        this.each(function() {
        	console.log(a(b.mainCell,a(this)).children());
            var c = a.extend({},
            a.fn.slide.defaults, b),
            //合并数组对象,将用户传参与默认值合并,用户传参替换默认值
            d = a(this),//a()为jquery里面的默认选择函数,d=调用slide的元素
            e = c.effect,//'fade'
            f = a(c.prevCell, d),//从调用slide的元素中选择.prev类赋值给f
            g = a(c.nextCell, d),//从调用slide的元素中选择.next类赋值给g
            h = a(c.pageStateCell, d),//从调用slide的元素中选择.pageState类赋值给h
            i = a(c.playStateCell, d),//从d中选择.playState类赋值给i
            j = a(c.titCell, d),//从d中选择titCell赋值给j
            k=j.length,//计算tab头中元素个数赋值给k
            // k = j.size(),
            l = a(c.mainCell, d),//从d中选择tab-content元素赋值给l
            m=l.children().length,//从tab-content中选择直接子元素计算数量赋值给m
            // m = l.children().size(),
            n = c.switchLoad,//null
            o = a(c.targetCell, d),//从d中选择要实现切换内容的元素赋值给o,应该为元素集合
            p = parseInt(c.defaultIndex),//默认索引,切换的第一个元素索引赋值给p
            q = parseInt(c.delayTime),//取内容显示时间长段时间值赋值给q
            r = parseInt(c.interTime);
            parseInt(c.triggerTime);
            var Q, t = parseInt(c.scroll),//每次滚动个数赋值给t
            u = parseInt(c.vis),//可视个数
            v = "false" == c.autoPlay || 0 == c.autoPlay ? !1 : !0,//支持false,0两种赋值方式
            w = "false" == c.opp || 0 == c.opp ? !1 : !0,
            x = "false" == c.autoPage || 0 == c.autoPage ? !1 : !0,
            y = "false" == c.pnLoop || 0 == c.pnLoop ? !1 : !0,
            z = "false" == c.mouseOverStop || 0 == c.mouseOverStop ? !1 : !0,
            A = "false" == c.defaultPlay || 0 == c.defaultPlay ? !1 : !0,
            B = "false" == c.returnDefault || 0 == c.returnDefault ? !1 : !0,
            C = 0,
            D = 0,
            E = 0,
            F = 0,
            G = c.easing,//缓动效果赋值给G
            H = null,
            I = null,
            J = null,
            K = c.titOnClassName,//命中titCell时添加类名赋值给K
            L = j.index(d.find("." + K)),//j为鼠标触发事件的元素集合,d为包括nav和tab-content的父元素,在d中查找目前命中的元素titCell赋值给L
            M = p = -1 == L ? p: L,//如果nav有active的元素li时,则将索引赋值给p,M,没有时,则取传参或默认值
            N = p,
            O = p,
            P = m >= u ? (0 != m % t ? m % t: t): 0,//总数不能整除滚动个数时,就取余数;能整除就取滚动个数;如果总数大于=可视个数,就取计算得出的滚动个数,否则取0;
            R = "leftMarquee" == e || "topMarquee" == e ? !0 : !1,
            S = function() {
                a.isFunction(c.startFun) && c.startFun(p, k, d, a(c.titCell, d), l, o, f, g)
            },//如果用户自定义了startFun,就调用
            T = function() {
                a.isFunction(c.endFun) && c.endFun(p, k, d, a(c.titCell, d), l, o, f, g)
            },//如果用户自定义了endFun,就调用
            U = function() {
                j.removeClass(K),//清除所有
                A && j.eq(N).addClass(K)//给自定义的第一个添加(在defaultPlay=true)时执行
            };
            if ("menu" == c.type) return A && j.removeClass(K).eq(p).addClass(K),//defaultPlay=true时清除用户已经定义的激活类
            j.hover(function() {
                Q = a(this).find(c.targetCell);
                var b = j.index(a(this));//查找当前元素在titCell中的索引

  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值