zoukankan      html  css  js  c++  java
  • 功能较简单的jq tab选项卡

    (function ($) {
        //tab插件
        //可自定义事件
        $.fn.mytab = function (options) {
            var defaults = {
                tabContent:'.tabContent > li',
                type:'mouseenter',
                autotab:false, //自动切换
                callback:null
            };
            options = $.extend(defaults, options);
            var _this = $(this);
            var $tabConli = $(options.tabContent);
            var num = _this.length-1,
                count = 0,
                timer=null;
            function autoAnim(){
                timer=setTimeout(function(){
                    count = (count == num) ? 0 : count + 1;
                    _this.eq(count).trigger(options.type);
                    setTimeout(arguments.callee,3000);
                },3000);
            }
            return this.each(function () {
                _this.bind(options.type,function () {
                    clearTimeout(timer);
                    $(this).addClass('on').siblings().removeClass('on');
                    var index = _this.index(this);
                    $tabConli.eq(index).stop(false,true).show(function(){
                        autoAnim();
                    }).siblings().hide();
                }).eq(0).trigger(options.type);
                if (options.autotab) {
                    autoAnim();
                }
            });
    
        };
    })(jQuery);
    
    $(document).ready(function () {
        $('.tabMenu > li').mytab({
            autotab:true
        });
    });
    

      

  • 相关阅读:
    20199106 2019-2020-2 《网络攻防实践》第三周作业
    Vulnhub
    NEEPU-CTF 2021 Web后四题Writeup
    Vulnhub
    [VNCTF 2021]naive题解
    F5杯 Web部分题目Writeup by atao
    CTFSHOW SSTI 刷题
    C语言文件
    函数+进制转换器
    C语言知识点小结
  • 原文地址:https://www.cnblogs.com/webFrontDev/p/2786036.html
Copyright © 2011-2022 走看看