MediaWiki:Mobile.js:修订间差异

无编辑摘要
无编辑摘要
标签手工回退 移动版编辑 移动版网页编辑
无编辑摘要
标签移动版编辑 移动版网页编辑
第108行: 第108行:
         }
         }
          
          
         ul.width(containerWidth * lis.length).attr({
        // 设置 ul 和 li 的宽度
         ul.css({
            'width': (containerWidth * lis.length) + 'px',
            '-webkit-transform': 'translateX(0px)',
            '-moz-transform': 'translateX(0px)',
            '-ms-transform': 'translateX(0px)',
            '-o-transform': 'translateX(0px)',
            'transform': 'translateX(0px)',
            '-webkit-transition': 'transform 0.73s ease-in-out',
            '-moz-transition': 'transform 0.73s ease-in-out',
            '-o-transition': 'transform 0.73s ease-in-out',
            'transition': 'transform 0.73s ease-in-out'
        }).attr({
             'data-left': 0,
             'data-left': 0,
             'data-length': lis.length
             'data-length': lis.length
         });
         });
          
          
         lis.width(containerWidth);
         lis.css('width', containerWidth + 'px');
         log('设置 ul 宽度: ' + (containerWidth * lis.length) + ', 每个 li 宽度: ' + containerWidth);
         log('设置 ul 宽度: ' + (containerWidth * lis.length) + ', 每个 li 宽度: ' + containerWidth);
          
          
         // 设置初始位置和过渡效果
         // 强制重绘
         ul.css({
         ul[0].offsetHeight;
            'margin-left': '0px',
            'transition': 'margin-left 0.73s ease-in-out'
        });
          
          
         // 开始滚动
         // 开始滚动
第142行: 第151行:
             }
             }
              
              
             var marginLeft = -(newLeft * containerWidth);
             var translateX = -(newLeft * containerWidth);
             ul.css({
              
                 'margin-left': marginLeft + 'px',
            // 重置时先移除 transition,立即跳转,然后恢复
                 'transition': 'margin-left 0.73s ease-in-out'
            if (newLeft === 0) {
            });
                ul.css({
                    '-webkit-transition': 'none',
                    '-moz-transition': 'none',
                    '-o-transition': 'none',
                    'transition': 'none',
                    '-webkit-transform': 'translateX(0px)',
                    '-moz-transform': 'translateX(0px)',
                    '-ms-transform': 'translateX(0px)',
                    '-o-transform': 'translateX(0px)',
                    'transform': 'translateX(0px)'
                });
                ul[0].offsetHeight; // 强制重绘
                 setTimeout(function() {
                    ul.css({
                        '-webkit-transition': 'transform 0.73s ease-in-out',
                        '-moz-transition': 'transform 0.73s ease-in-out',
                        '-o-transition': 'transform 0.73s ease-in-out',
                        'transition': 'transform 0.73s ease-in-out'
                    });
                }, 50);
                 log('设置 transform: translateX(0px)');
            } else {
                ul.css({
                    '-webkit-transition': 'transform 0.73s ease-in-out',
                    '-moz-transition': 'transform 0.73s ease-in-out',
                    '-o-transition': 'transform 0.73s ease-in-out',
                    'transition': 'transform 0.73s ease-in-out',
                    '-webkit-transform': 'translateX(' + translateX + 'px)',
                    '-moz-transform': 'translateX(' + translateX + 'px)',
                    '-ms-transform': 'translateX(' + translateX + 'px)',
                    '-o-transform': 'translateX(' + translateX + 'px)',
                    'transform': 'translateX(' + translateX + 'px)'
                });
                log('设置 transform: translateX(' + translateX + 'px)');
            }
           
             dataset.left = newLeft;
             dataset.left = newLeft;
            log('设置 margin-left: ' + marginLeft + 'px');
         }, 5000);
         }, 5000);
          
          
第159行: 第202行:
             if (containerWidth === 0) return;
             if (containerWidth === 0) return;
              
              
             ul.width(containerWidth * lis.length);
             ul.css('width', (containerWidth * lis.length) + 'px');
             lis.width(containerWidth);
             lis.css('width', containerWidth + 'px');
              
              
             var currentLeft = parseInt(ul[0].dataset.left) || 0;
             var currentLeft = parseInt(ul[0].dataset.left) || 0;
             if (currentLeft < 0) currentLeft = 0;
             if (currentLeft < 0) currentLeft = 0;
            var translateX = -(currentLeft * containerWidth);
             ul.css({
             ul.css({
                 'margin-left': -(currentLeft * containerWidth) + 'px',
                 '-webkit-transition': 'transform 0.37s ease-in-out',
                 'transition': 'margin-left 0.37s ease-in-out'
                '-moz-transition': 'transform 0.37s ease-in-out',
                 '-o-transition': 'transform 0.37s ease-in-out',
                'transition': 'transform 0.37s ease-in-out',
                '-webkit-transform': 'translateX(' + translateX + 'px)',
                '-moz-transform': 'translateX(' + translateX + 'px)',
                '-ms-transform': 'translateX(' + translateX + 'px)',
                '-o-transform': 'translateX(' + translateX + 'px)',
                'transform': 'translateX(' + translateX + 'px)'
             });
             });
         });
         });