打开/关闭菜单
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

User:弃权者/Common.js.bak:修订间差异

来自OGAS数据中枢
秋绘君留言 | 贡献
无编辑摘要
弃权者留言 | 贡献
弃权者移动页面MediaWiki:Common.jsUser:弃权者/Common.js.bak,不留重定向:​精简js尝试优化加载速度
 
(未显示2个用户的16个中间版本)
第1行: 第1行:
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */
/* 萌百风格 Tabs 自动转换脚本 */
 
$(function() {
// 使用 mw.hook 监听内容变化,兼容 Citizen 的无刷新加载
     $('.Tabs').each(function() {
mw.hook('wikipage.content').add(function($content) {
 
    //强制唤醒折叠元素 (解决导航栏卡住、全展开问题)
    mw.loader.using('jquery.makeCollapsible').then(function () {
        // 让页面里所有的 .mw-collapsible 重新活过来
        $content.find('.mw-collapsible').makeCollapsible();
    });
 
   
    // 2. 萌百风格 Tabs 自动转换脚本
    // ==========================================
    // 注意这里把原来的 $('.Tabs') 改成了 $content.find('.Tabs')
     $content.find('.Tabs').each(function() {
         var $tabsContainer = $(this);
         var $tabsContainer = $(this);
       
         // 1. 检查是否已经初始化过
         // 1. 检查是否已经初始化过
         if ($tabsContainer.hasClass('tabs-initialized')) return;
         if ($tabsContainer.hasClass('tabs-initialized')) return;
第38行: 第51行:
         });
         });


         // 4. 清空原有的“散装”内容,插入标准结构
         // 清空原有的“散装”内容,插入标准结构
         $tabsContainer.empty().append($labelWrapper).append($contentWrapper).addClass('tabs-initialized');
         $tabsContainer.empty().append($labelWrapper).append($contentWrapper).addClass('tabs-initialized');
     });
     });
});
});


/* 首页智能无缝轮播图 */
/* 导航胶囊互斥逻辑:确保同一时间只有一个面板展开 */
mw.hook('wikipage.content').add(function($content) {
mw.hook('wikipage.content').add(function($content) {
     $content.find('.dynamic-carousel').each(function() {
    // 监听所有带有 .nav-pill-btn 类的点击
         var $carousel = $(this);
     $content.find('.nav-pill-btn').on('click', function() {
         var $track = $carousel.find('.carousel-track');
         var $clicked = $(this);
         var $originalSlides = $track.find('.carousel-slide');
        // 使用正则提取编号 (例如 mw-customtoggle-game1 -> 1)
        var originalCount = $originalSlides.length;
         var match = $clicked.attr('class').match(/mw-customtoggle-game(\d+)/);
        if (!match) return;
       
        var currentId = match[1];
         var $myContent = $('#mw-customcollapsible-game' + currentId); // 修正:此处使用 + 拼接


         // 如果图太少,就不折腾了
         // 如果我们正准备打开这个面板 (它目前带有折叠类 mw-collapsed)
         if (originalCount <= 1) {
         if ($myContent.hasClass('mw-collapsed')) {
            $carousel.find('.carousel-btn, .carousel-dots').hide();
            // 找到所有其他的导航内容面板
             return;  
            $('.nav-pill-content').not($myContent).each(function() {
                var $other = $(this);
                // 如果发现某个面板不是折叠状态,则模拟点击对应的按钮让其收回
                if (!$other.hasClass('mw-collapsed')) {
                    var otherNum = $other.attr('id').replace('mw-customcollapsible-game', '');
                    $('.mw-customtoggle-game' + otherNum).click();
                }
             });
         }
         }
    });
});


        // 核心魔术:偷偷把第一张图复制一份放到最后
$(function() {
        var $firstClone = $originalSlides.first().clone();
    var $tooltip = $('<div id="custom-notetip-popup"></div>').appendTo('body').css({
        $track.append($firstClone);
         'position': 'absolute',
 
         'display': 'none',
        var $dotsContainer = $carousel.find('.carousel-dots');
         'z-index': '10000',
        var currentIndex = 0;
        'background': '#fff',
        var isAnimating = false; // 防止你手速太快狂点按钮
         'border': '1px solid #a2a9b1',
        var timer;
         'padding': '6px 8px',
 
         'box-shadow': '0 2px 4px rgba(0,0,0,0.2)',
        // 生成底部圆点
        'font-size': '14px',
        for (var i = 0; i < originalCount; i++) {
        'pointer-events': 'none'
            var $dot = $('<div class="dot"></div>');
    });
            if (i === 0) $dot.addClass('active');
            $dotsContainer.append($dot);
         }
         var $dots = $dotsContainer.find('.dot');
 
         // 更新圆点亮起状态
        function updateDots(index) {
            $dots.removeClass('active');
            if (index === originalCount) {
                $dots.eq(0).addClass('active'); // 如果滑到了假的第一张,亮起第一个圆点
            } else {
                $dots.eq(index).addClass('active');
            }
         }
 
         // 滑动控制中心
         function goToSlide(index) {
            if (isAnimating) return;
            isAnimating = true;
 
            // 打开滑动动画
            $track.css('transition', 'transform 0.5s cubic-bezier(0.25, 1, 0.5, 1)');


            // 如果在第一张还往左点,先瞬间传送到最后一张,再往前滑
    $(document).on('mouseenter', '.mw-custom-notetip', function() {
            if (index < 0) {
        var $this = $(this);
                $track.css('transition', 'none');
        var text = $this.data('notetip');
                $track.css('transform', 'translateX(-' + (originalCount * 100) + '%)');
        var rect = this.getBoundingClientRect();
                $track[0].offsetHeight; // 强制系统反应一下
       
                $track.css('transition', 'transform 0.5s cubic-bezier(0.25, 1, 0.5, 1)');
        $tooltip.text(text).show();
                currentIndex = originalCount - 1;
            } else {
                currentIndex = index;
            }


            var moveDistance = currentIndex * 100;
        var tipHeight = $tooltip.outerHeight();
            $track.css('transform', 'translateX(-' + moveDistance + '%)');
        var top = $(window).scrollTop() + rect.top - tipHeight - 10;
            updateDots(currentIndex);


            // 等动画播完(0.5秒),处理无缝衔接
        if (rect.top - tipHeight < 10) {
            setTimeout(function() {
            top = $(window).scrollTop() + rect.bottom + 10;
                // 如果滑到了假的第一张,瞬间关掉动画,传回真正的第一张
                if (currentIndex === originalCount) {
                    $track.css('transition', 'none');
                    $track.css('transform', 'translateX(0)');
                    currentIndex = 0;
                }
                isAnimating = false;
            }, 500);
         }
         }


         function startTimer() {
         $tooltip.css({
             clearInterval(timer);
             'top': top + 'px',
            timer = setInterval(function() {
             'left': (rect.left + (rect.width / 2) - ($tooltip.outerWidth() / 2)) + 'px'
                goToSlide(currentIndex + 1);
            }, 5000); // 5秒自动切下一张
        }
 
        // 按钮点击事件
        $carousel.find('.next-btn').on('click', function() {
             goToSlide(currentIndex + 1);
            startTimer();
        });
 
        $carousel.find('.prev-btn').on('click', function() {
            goToSlide(currentIndex - 1);
            startTimer();
         });
         });
 
    }).on('mouseleave', '.mw-custom-notetip', function() {
        $dots.on('click', function() {
        $tooltip.hide();
            if (isAnimating) return;
            goToSlide($(this).index());
            startTimer();
        });
 
        startTimer();
     });
     });
});
});

2026年5月10日 (日) 10:22的最新版本

/* 这里的任何JavaScript将为所有用户在每次页面加载时加载。 */

// 使用 mw.hook 监听内容变化,兼容 Citizen 的无刷新加载
mw.hook('wikipage.content').add(function($content) {

    //强制唤醒折叠元素 (解决导航栏卡住、全展开问题)
    mw.loader.using('jquery.makeCollapsible').then(function () {
        // 让页面里所有的 .mw-collapsible 重新活过来
        $content.find('.mw-collapsible').makeCollapsible();
    });

    
    // 2. 萌百风格 Tabs 自动转换脚本
    // ==========================================
    // 注意这里把原来的 $('.Tabs') 改成了 $content.find('.Tabs')
    $content.find('.Tabs').each(function() {
        var $tabsContainer = $(this);
        
        // 1. 检查是否已经初始化过
        if ($tabsContainer.hasClass('tabs-initialized')) return;

        // 2. 提取所有的标签和内容
        var $tabItems = $tabsContainer.find('> .Tab');
        if ($tabItems.length === 0) return;

        // 3. 创建标准的标签栏和内容容器
        var $labelWrapper = $('<div class="TabLabel"></div>');
        var $contentWrapper = $('<div class="TabContent"></div>');

        $tabItems.each(function(index) {
            var $item = $(this);
            var $label = $item.find('> .TabLabelText');
            var $content = $item.find('> .TabContentText');

            // 给第一个设为选中
            if (index === 0) {
                $label.addClass('selected');
                $content.addClass('selected');
            }

            // 绑定点击事件
            $label.on('click', function() {
                $labelWrapper.find('.TabLabelText').removeClass('selected');
                $contentWrapper.find('.TabContentText').removeClass('selected');
                $(this).addClass('selected');
                $content.addClass('selected');
            });

            $labelWrapper.append($label);
            $contentWrapper.append($content);
        });

        // 清空原有的“散装”内容,插入标准结构
        $tabsContainer.empty().append($labelWrapper).append($contentWrapper).addClass('tabs-initialized');
    });

});

/* 导航胶囊互斥逻辑:确保同一时间只有一个面板展开 */
mw.hook('wikipage.content').add(function($content) {
    // 监听所有带有 .nav-pill-btn 类的点击
    $content.find('.nav-pill-btn').on('click', function() {
        var $clicked = $(this);
        // 使用正则提取编号 (例如 mw-customtoggle-game1 -> 1)
        var match = $clicked.attr('class').match(/mw-customtoggle-game(\d+)/);
        if (!match) return;
        
        var currentId = match[1];
        var $myContent = $('#mw-customcollapsible-game' + currentId); // 修正:此处使用 + 拼接

        // 如果我们正准备打开这个面板 (它目前带有折叠类 mw-collapsed)
        if ($myContent.hasClass('mw-collapsed')) {
            // 找到所有其他的导航内容面板
            $('.nav-pill-content').not($myContent).each(function() {
                var $other = $(this);
                // 如果发现某个面板不是折叠状态,则模拟点击对应的按钮让其收回
                if (!$other.hasClass('mw-collapsed')) {
                    var otherNum = $other.attr('id').replace('mw-customcollapsible-game', '');
                    $('.mw-customtoggle-game' + otherNum).click();
                }
            });
        }
    });
});

$(function() {
    var $tooltip = $('<div id="custom-notetip-popup"></div>').appendTo('body').css({
        'position': 'absolute',
        'display': 'none',
        'z-index': '10000',
        'background': '#fff',
        'border': '1px solid #a2a9b1',
        'padding': '6px 8px',
        'box-shadow': '0 2px 4px rgba(0,0,0,0.2)',
        'font-size': '14px',
        'pointer-events': 'none'
    });

    $(document).on('mouseenter', '.mw-custom-notetip', function() {
        var $this = $(this);
        var text = $this.data('notetip');
        var rect = this.getBoundingClientRect();
        
        $tooltip.text(text).show();

        var tipHeight = $tooltip.outerHeight();
        var top = $(window).scrollTop() + rect.top - tipHeight - 10;

        if (rect.top - tipHeight < 10) {
            top = $(window).scrollTop() + rect.bottom + 10;
        }

        $tooltip.css({
            'top': top + 'px',
            'left': (rect.left + (rect.width / 2) - ($tooltip.outerWidth() / 2)) + 'px'
        });
    }).on('mouseleave', '.mw-custom-notetip', function() {
        $tooltip.hide();
    });
});