IE에서 입력 깜박임을 발생시키는 애니메이션 gif

페이지에 애니메이션 GIF가있을 때 입력의 커서가 IE7에서 깜박입니다.IE에서 입력 깜박임을 발생시키는 애니메이션 gif

gif를 제거하면 문제가 해결됩니다.

편집 (다시) : 내가 정말로 필요한 것은 기괴한 버그에 대한 답변을 알고있는 사람입니다.

저는 10 년 이상의 경험을 가진 웹 응용 프로그램 개발자입니다. 믿어주세요. 디버깅하는 법을 알고 있습니다. 예를 들어, 애니메이션 gif가 화면을 그리는 이유는 성공적인 디버그의 결과라는 사실을 알고 있다는 것입니다. 그 문제를 해결하는 것도 또 다른 문제입니다.

내 gif와 아래의 답변 3의 코드를 사용하여 편집하십시오.

<html> 
    <head> 
     <style type="text/css"> 
      #img { 
       position: absolute; 
      } 
      #dv { 
       background-color: transparent; 
       border: 1px solid Black; 
       height: 450px; 
       position: absolute; 
       width: 600px; 
      } 
      #frm { 
       left: 170px; 
       position: absolute; 
       top: 100px; 
      } 
     </style> 
    </head> 
    <body> 
     <img src="http://www.johnherr.net/skeleton.gif" id="img"> 
     <div id="dv"> 
     </div> 
     <form id="frm"> 
      <input type="text"> 
     </form> 
    </body> 
</html>

출처

2009-05-21 Anonymous

gif 크기를 알려주시겠습니까? (치수 및 파일 크기) –

이 문제를 디버깅하는 첫 번째 단계는 주변의 모든 정크를 제거하는 것입니다. 이 프로세스가 진행되는 동안 작업이 완료되면 완료됩니다. 그렇지 않다면 가능한 한 간단하게 문제를 해결했습니다. 외부 도움을 요청하지 않더라도 디버깅이 진행되는 한 최선의 방법입니다. – Brian

아마도 부하를 처리 할 수없는 CPU입니까? 이것은 집중 자바 스크립트를 실행하는 웹 사이트의 오래된 컴퓨터에서 특히 발생할 수 있습니다.

출처

2009-05-21 18:02:05 Malfist

아니, 그렇지 않아. 기계는 괜찮아. 나는 게임 회사에서 일하므로 CPU, RAM 및 비디오 카드는 싸지 않습니다. :) –

우리는 적어도 당신이 그것을 어떻게 배치하는지에 대한 생각을 갖도록 약간의 HTML을 제공하십시오. –

우리는 애니메이션 GIF가 절대적으로 배치되었다고 말하면 족합니다. 그것 ~ 600 x 400입니다. 그것은 아래에 앉아 또 다른 복근. 위치가 div 인 은 투명 레이어를 제공합니다. 마지막으로 양식 자체가 abs입니다. 그 위에 을 배치했습니다.

<style type="text/css"> 
#img { 
    position: absolute; 
} 
#dv { 
    background-color: transparent; 
    border: 1px solid Black; 
    height: 450px; 
    position: absolute; 
    width: 600px; 
} 
#frm { 
    left: 170px; 
    position: absolute; 
    top: 100px; 
} 
</style> 
<img src="http://vulcan.wr.usgs.gov/Imgs/Video/MSH/MSH06/MSH06_MOVIE_before_after_from_brutus_10-21_and_10-22-06_animated.gif" id="img"> 
<div id="dv"> 
</div> 
<form id="frm"> 
<input type="text"> 
</form>

난 당신이 가능한 한 자세히 설명 무엇을 복제했습니다. 위의 내용을 IE 6, 7 및 8에로드했는데 깜박 거리는 커서 문제를 볼 수 없었습니다.

내가 할 수없는 것 문제가 발생하지 않습니다 구현 가지고 올 수 있음을 감안할 때 어떤 일반적인 애니메이션 - GIF - 원인 - 입력 커서 깜박임 특정의 IE 7의 버그 뭔가를 마크 업과 CSS가 해당 브라우저에서 문제를 드러내고 있습니다.

GIF를 제거하면 문제가 사라집니다.

gif가 화면 그리기 이유 인 사실을 알고있는 경우 은 디버그가 성공한 결과입니다.

확실히 애니메이션 GIF를 추가하면 퍼즐의 마지막 부분을 볼 수 있습니다. 그러나 필자가 시연했듯이, 절대적으로 배치 된 애니메이션 GIF 위에 절대적으로 배치 된 형태를 가질 수 있으며, 그 사이에는 투명 div가 있고 커서는 깜박 거리지 않습니다.

마크 업이나 CSS를 통해 문제를 드러내는 부분을 구체적으로 결정할 때까지 한 번에 한 레이어 씩 벗겨 내야한다고 생각합니다.

다른 가능성이 있습니다. 표시되는 깜박임은 비디오 카드 및/또는 비디오 드라이버의 아티팩트 일 수 있습니다. 이 가능성을 배제하기 위해 하드웨어가 완전히 다른 컴퓨터에서 Internet Explorer 7의 페이지를 보려고 할 수 있습니다.

출처

2009-05-21 19:56:14

시도에 감사하지만 잘못된 것입니다. 귀하의 예에서 사용한 애니메이션 GIF는 낮은 프레임 율을가집니다. 분명히하기 위해서 : 나는 당신의 모범을 깜박 거리지 않았다. 코드를 수정하고 이미지를 사용했는데 깜박임이 있습니다. 이를 반영하기 위해 원본 게시물을 편집했습니다. 시도는 고맙지 만 문제는 계속되고 원본 분석은 여전히 최고의 방법입니다. –

같은 문제가있었습니다. 애니메이션 GIF를 제거하면 깜박임이 멈 춥니 다.

CSS를 보면 이미지가 디스플레이 용으로 리사이즈되고 있음을 발견했습니다.

필요한 크기로 온라인 편집기를 사용하여 이미지 사본을 만들었습니다.

애니메이션 GIF를 크기 조정이 필요없는 버전으로 전환하면 문제가 해결됩니다.

출처

2012-09-28 09:45:30

질문에있는 이미지의 크기가 조정되었음을 어떻게 알 수 있습니까? –

IE에서 입력 깜박임을 발생시키는 애니메이션 gif

답변

관련 문제