ios6 <input>에 자리 표시 자 텍스트가있는 경우 방향 변경시 사파리 버그

모바일 사파리 iOS6에만 세로 방향에서 가로 방향으로 레이아웃을 바꿀 때 레이아웃이 왼쪽으로 이동하는 버그가 있습니다.ios6 <input>에 자리 표시 자 텍스트가있는 경우 방향 변경시 사파리 버그

버그는 자리 표시 자 속성에 내용이있는 경우에만 존재하며, 자리 표시 자 속성의 내용을 제거하면 방향 변경에 버그가 없습니다. http://beta.9eggs.com/ios6.html에 데모를 설정 했으므로 입력의 자리 표시 자의 내용을 전환하고 버그를 제거 할 수 있습니다.

레이아웃 문제를 해결하는 솔루션을 보았지만 자리 표시자가 문제를 일으켜 해결할 이유를 이해하고 싶습니다. 포함 된 레이아웃은 아닙니다.

출처

2012-10-01 Mike

해결 방법을 찾았습니까? 방금이 문제를 직접 발견했지만 해결 방법을 찾을 수 없습니다. – Andrew

나는 같은 문제를 다루어왔다. 그것은 고통이다! –

This related question 나를 위해 효과적인 해결책을 안내해주십시오. 그것은이 범용 kludge로 귀결됩니다.

if (/iPhone/.test(navigator.userAgent) && 
    !/Opera Mini/.test(navigator.userAgent)) 
{ 
    window.addEventListener("orientationchange", function(e){ 
    /* 
     // Method A: 
     var s = document.documentElement.style; 
     s.display = 'none'; 
     setTimeout(function(){ s.display = 'block'; }, 0); 
    */ 
     // Method B: 
     var d = document.documentElement; 
     setTimeout(function(d){ d.className = d.className; }, 0); 
    }); 
}

희망이 있습니다.

출처

2012-11-05 15:57:01

'getElementsByTagName' 대신'document.documentElement'를 사용할 수 있습니다. https://developer.mozilla.org/en-US/docs/DOM/document.documentElement – Trevor

감사합니다! 예제를 업데이트하고 거기에 사소한 오타를 수정했습니다. :) –

이 솔루션은 좋지만 짧은 "플래시"가됩니다. (예를 '(/iPhone/.test(navigator.userAgent) && 경우/오페라 미니/.test (navigator.userAgent)) { window.addEventListener ("위해서 orientationchange", 기능 : 당신은 단순한를 칠 강제 할 수) { var c = document.documentElement; setTimeout (function() {c.className = c.className;}); }); }' –

을 input의 부모 요소에 설정하면 저에게 효과적입니다.

출처

2013-01-03 18:35:09 Andrey

주변에서 시간을 보내고 발견했습니다! 도와 주셔서 감사합니다! – earnold

단어는이 단어를 찾는 방법을 알려주는 방법, 문제를 자리 표시 자 속성으로 정확히 지적하는 데 걸린 시간,이 특정 답변을 온라인으로 찾는 것이 얼마나 어려웠는지 표현할 수 없습니다. ''요소가 포함 된 ''에'style = "overflow : hidden;"'을 적용하면 해결됩니다. –

ios6 <input>에 자리 표시 자 텍스트가있는 경우 방향 변경시 사파리 버그

답변

관련 문제