jQuery课程表选项卡滑动切换代码

作者 : 小刺猬 本文共704个字,预计阅读时间需要2分钟 发布时间: 2020-08-7 共252人阅读

jQuery课程表选项卡滑动切换代码

这是一款蓝色风格的jQuery课程表选项卡滑动切换代码,以选项卡的方式查看学校机房信息课程表样式。

js代码

<script language="javascript">
(function (window, $, undefined) {
    /*
     * tab切换插件
     * 用例:$('*').createTab();
     */
    $.fn.createTab = function (opt) {
        var def = {
            activeEvt: 'mouseover',
            activeCls: 'cur'
        }
        $.extend(def, opt);
        this.each(function () {
            var $this = $(this);
            var timer;
            $this.find('ul.title li').mouseover(def.activeEvt,function(){
                var index = $(this).index(),
                    that = $(this);
                timer = setTimeout(function(){
                    that.addClass('cur').siblings().removeClass('cur');
                    $this.find('div.list').animate({marginLeft:-1000*index},'slow');
                },300);
            }).mouseout(function(){
                clearTimeout( timer );
            })
        });
    }

})(window, jQuery);
$(function(){
    $(".jyTable").createTab()
})
</script>
VIP免费 永久VIP免费

已有0人支付


刺猬源码 » jQuery课程表选项卡滑动切换代码

刺猬QQ交流群号多少?
363432
刺猬官方有技术支持吗?
有的,但技术支持是有偿服务哦,咨询右下角的在线客服吧!
下载的资源不能使用怎么办?
如果在本站下载的资源不能使用,一经确认可以联系在线客服退款。

发表评论

刺猬源码网,累计帮助1000+用户成功建站,为草根创业提供助力!

立即查看 了解详情