MediaWiki

EventList.js:修订间差异

来自卡厄思梦境WIKI

律Rhyme留言 | 贡献
无编辑摘要
律Rhyme留言 | 贡献
无编辑摘要
第12行: 第12行:
             // 如果已经是active,则隐藏效果并移除active
             // 如果已经是active,则隐藏效果并移除active
             $this.removeClass('active');
             $this.removeClass('active');
             $effect.slideUp(200);
             $effect.slideUp(200, function() {
                adjustContainerHeight($container);
            });
         } else {
         } else {
             // 隐藏同一事件中其他选项的效果
             // 隐藏同一事件中其他选项的效果
第20行: 第22行:
             // 显示当前选项的效果
             // 显示当前选项的效果
             $this.addClass('active');
             $this.addClass('active');
             $effect.slideDown(200);
             $effect.slideDown(200, function() {
                adjustContainerHeight($container);
            });
         }
         }
    });
   
    // 调整容器高度的函数
    function adjustContainerHeight($container) {
        var totalHeight = 170; // 基础高度(到选项开始的位置)
        var backgroundHeight = 10; // 背景底部padding
          
          
         // 动态调整容器高度
         // 计算所有可见元素的高度
         setTimeout(function() {
         $container.find('.event-option, .event-effect:visible').each(function() {
            var totalHeight = 170; // 基础高度
            totalHeight += $(this).outerHeight(true);
            $container.find('.event-option, .event-effect:visible').each(function() {
        });
                totalHeight += $(this).outerHeight(true);
       
            });
        // 额外添加一些底部空间
            $container.find('.event-background').css('min-height', (totalHeight - 160) + 'px');
        totalHeight += 10;
         }, 210);
       
        // 设置容器和背景的高度
        $container.css('min-height', totalHeight + 'px');
        $container.find('.event-background').css('height', (totalHeight - 160) + 'px');
    }
   
    // 初始化时调整所有容器的高度
    $('.event-container').each(function() {
         adjustContainerHeight($(this));
     });
     });
});
});

2025年10月18日 (六) 12:41的版本

$(function() {
	mw.loader.load( mw.util.getUrl( 'MediaWiki:EventList.css', { action: 'raw', ctype: 'text/css' } ), 'text/css' );
    // 为每个事件选项添加点击事件
    $('.event-option').click(function() {
        var $this = $(this);
        var optionIndex = $this.data('option-index');
        var $container = $this.closest('.event-container');
        var $effect = $container.find('.event-effect[data-effect-index="' + optionIndex + '"]');
        
        // 切换active状态
        if ($this.hasClass('active')) {
            // 如果已经是active,则隐藏效果并移除active
            $this.removeClass('active');
            $effect.slideUp(200, function() {
                adjustContainerHeight($container);
            });
        } else {
            // 隐藏同一事件中其他选项的效果
            $container.find('.event-option').removeClass('active');
            $container.find('.event-effect').slideUp(200);
            
            // 显示当前选项的效果
            $this.addClass('active');
            $effect.slideDown(200, function() {
                adjustContainerHeight($container);
            });
        }
    });
    
    // 调整容器高度的函数
    function adjustContainerHeight($container) {
        var totalHeight = 170; // 基础高度(到选项开始的位置)
        var backgroundHeight = 10; // 背景底部padding
        
        // 计算所有可见元素的高度
        $container.find('.event-option, .event-effect:visible').each(function() {
            totalHeight += $(this).outerHeight(true);
        });
        
        // 额外添加一些底部空间
        totalHeight += 10;
        
        // 设置容器和背景的高度
        $container.css('min-height', totalHeight + 'px');
        $container.find('.event-background').css('height', (totalHeight - 160) + 'px');
    }
    
    // 初始化时调整所有容器的高度
    $('.event-container').each(function() {
        adjustContainerHeight($(this));
    });
});