내 로딩 아이콘 내가 로딩 아이콘과 같이이 IE8

Question

에서 페이드 아웃되지 않은 : 가끔 로딩 아이콘이 IE8에서 사라지지 않는, 그러나

$(document).ready(function() { 
    var $img = $('<img>', { 
    src: '../images/loader.gif', 
    id: 'dvLoading', 
    css: { 
     position: 'fixed', 
     left: '50%', 
     top: '50%', 
     margin: '-25px 0 0 -25px;', 
     filter: 'inherit' 
    } 
    }).load(function() { 
    $(this).fadeOut(2000); 
    }); 
    $('body').append($img); 
}); 

. 다른 사이트를 체크 아웃, 사람들은 IE8은 fadeOut와 함께 잘 작동하지 않는다고 말했어 특히 상대적 위치가 있다면. 그러나 고정 위치 지정을 사용하고 있습니다. 고정 위치를 대체 할 수 있고 화면 중앙에 아이콘이 나타납니다. 또는 IE8에서 fodeOut()을위한 더 나은 주위에 일이있다

편집 :

I도 추가 해봤 필터 : 상속; 운이없는 나의 css에. 감사합니다.

Answer 1

특정 버전의 IE에서는 .src 속성 전에 .load() 처리기가 적용되었는지를 반드시 확인해야합니다. 이미지가 브라우저 캐시에 있으면 .src 속성을 설정하면 IE에서 onload 이벤트를 즉시 발생시킬 수 있습니다. 이 경우로드 이벤트는 이미 .load() 핸들러를 연결하기 전에 발생했을 수 있으므로 이벤트를 놓친 코드는 .fadeOut()을 트리거하지 않습니다.

해결책은 .src이 설정되기 전에 .load() 처리기가 연결되어 있음을 보장 할 수 있도록 몇 단계로 작업하는 것입니다.

$(document).ready(function() { 
    $('<img>', { 
     id: 'dvLoading', 
     css: { 
      position: 'fixed', 
      left: '50%', 
      top: '50%', 
      margin: '-25px 0 0 -25px;', 
      filter: 'inherit' 
     } 
    }).load(function() { 
     $(this).fadeOut(2000); 
    }).attr("src", '../images/loader.gif') 
     .appendTo(document.body); 
}); 

당신은 또한 IE에서 CSS에 문제가있을 가능성이 있다면, 다음 그래서 우리는 (실행 코드를 보지 않고 그렇게 하드) IE의 이전 버전에서 디버깅 할 수있는 작업 jsFiddle을 게시하시기 바랍니다.