라공 에디션의 타임라인 타래 스킨, 모바일 사파리에서만 일어나는 버그를 수정한 코드 백업.

수정 위치 > timethread_up → list.log.skin.script.php 맨 아래에 추가.

// 모바일 사파리 환경 검증 함수
function isMobileSafari() {
    var ua = window.navigator.userAgent;
    var isIOS = /iPad|iPhone|iPod/.test(ua) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1);
    var isWebkit = /WebKit/.test(ua);
    var isChrome = /CriOS/.test(ua);
    var isFxiOS = /FxiOS/.test(ua);
    var isOros = /OPiOS/.test(ua);

    return isIOS && isWebkit && !isChrome && !isFxiOS && !isOros;
}

// 본문 토글 버튼 클릭 이벤트
$(document).on('click', 'a.post-toggle-btn', function(e) {
    e.preventDefault();
    var $postContent = $(this).closest('.post-content');
    var threshold = parseInt($postContent.data('max-height')) || 300;
    
    var fullHeight = $postContent.prop('scrollHeight');
    var isSafari = isMobileSafari();

    if (isSafari) {
        var rawElement = $postContent.get(0);
        if (rawElement) {
            rawElement.style.webkitTransform = 'translateZ(0)';
            var dummy = rawElement.offsetHeight;
            fullHeight = rawElement.scrollHeight;
        }
    }

    if ($postContent.hasClass('expanded')) {
        // [닫기 로직]
        var currentHeight = $postContent.height();
        $postContent.css({
            'height': currentHeight + 'px',
            'max-height': 'none'
        });

        setTimeout(function() {
            $postContent.animate({
                'max-height': threshold + 'px',
                'height': threshold + 'px'
            }, 300, function() {
                $postContent.removeClass('expanded').css({
                    'overflow': 'hidden',
                    'height': 'auto'
                });
                $postContent.find('.post-toggle-btn').text('OPEN');
                relayoutMasonry(100);
            });
        }, 10);
    } else {
        // [열기 로직]
        var expandedHeight = fullHeight + 50;
        
        if (isSafari) {
            $postContent.css({
                'max-height': 'none',
                'height': $postContent.height() + 'px'
            });
        }

        $postContent.animate({
            'max-height': expandedHeight + 'px',
            'height': expandedHeight + 'px' 
        }, 300, function() {
            // 🔥 애니메이션이 완전히 끝난 시점
            setTimeout(function() {
                $postContent.addClass('expanded').css({
                    'overflow': 'visible',
                    'max-height': 'none',
                    // 🔥 사파리에서 'none' 대신 '' (빈 값)을 주어 인라인 스타일 지우기 -> 브라우저 기본 렌더링 유도
                    'height': isSafari ? '' : 'auto' 
                });

                // 🔥 [핵심 해결책] 사파리 텍스트 재렌더링 강제 트리거
                if (isSafari) {
                    var el = $postContent.get(0);
                    if (el) {
                        // 1. 디스플레이를 순간적으로 바꿨다 풀어 글자 레이아웃을 강제 재계산
                        el.style.display = 'inline-block';
                        var dummy = el.offsetHeight; 
                        el.style.display = 'block';
                        
                        // 2. 가속 레이어 업데이트 힌트 제공
                        el.style.webkitTransform = 'none';
                        var dummy2 = el.offsetHeight;
                        el.style.webkitTransform = 'translateZ(0)';
                    }
                }

                $postContent.find('.post-toggle-btn').text('CLOSE');
                relayoutMasonry(100);
            }, 50); // 💡 사파리가 프레임을 안착할 수 있도록 여유 시간을 50ms로 살짝 늘림
        });
    }
});