2011-08-10 8 views
0

IE6-IE8의 투명 PNG에서 페이딩이 왜곡되는 문제를 해결하기 위해 jQuery의 fadeIn 효과를 전역 대체하는 방법이 있습니까? 오히려 .fadeIn를 사용하여 내 각 기능을 통해가는 경우는/다른 진술을하는 것보다, jQuery를의 방식이 fadeIn을위한 전역 대체 - IE 오류, jQuery

$(whichCarousel).find('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast"); 

:

는 내 말은 내가 지금 이런 일이있다 전 세계적으로 말 : 당신은 그것이 fadeIn()을 수행 있도록 호환되는 브라우저의 경우 show() 메소드를 오버라이드 (override)하고, 그렇지 않으면 원래 show()으로 되돌릴 수

if ($.browser.msie && $.browser.version.substr(0,1)<9) >> find ".fadeIn" and change to ".show();"` ? 
+0

원래의'show()'로 돌아 가기 위해 호환 가능한 브라우저 인 경우'fadeIn()'을 수행하도록'show()'메소드를 오버라이드 할 수 있습니다. –

답변

1

.

<button id="go">Try Me</button> 
<div id="test" style="display: none">Your Content</div> 

<script type="text/javascript"> 

(function($, oldMethod) {  
    $.fn.show = function() { 
     if ($.browser.msie && $.browser.version.substr(0,1) < 9) { 
      oldMethod.apply(this, arguments); 
     } else { 
      $(this[0]).css("opacity",0); 
      oldMethod.apply(this, arguments); 
      $.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]); 
     } 
    }; 
})(jQuery, jQuery.fn.show); 

$(function() { 
    $('#go').click(function() { 
     $('#test').show(); 
    }); 
}); 

</script> 

당신은 this jsFiddle와 데모를 볼 수 있습니다 여기에 예입니다. 나는 IE9와 크롬 13에서 테스트를하고 잘 작동하는 것처럼 보였다.

편집

난 그냥이 종류의 비효율적 인 것을 깨달았다. 에있는 브라우저 버전을 확인하면 번으로 전화가 show()입니다. 대신 (안된)이 작업을 수행 할 수 있습니다

(function($, oldMethod) { 
    if (!($.browser.msie && $.browser.version.substr(0,1) < 9)) { 
     $.fn.show = function() { 
      $(this[0]).css("opacity",0); 
      oldMethod.apply(this, arguments); 
      $.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]); 
     }; 
    } 
})(jQuery, jQuery.fn.show); 

이이 기능은 버전 9 A jsFiddle example에서 비 IE 브라우저에 대해 재정의되도록합니다. 원래 show() 함수는 여전히 존재할 수 있습니다. 또한

,이 덩어리 이유 :

$(this[0]).css("opacity",0); 
oldMethod.apply(this, arguments); 
$.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]); 

이기 때문에 fadeIn() 호출 어떤 점에서 show(), 우리 때문에 무한 재귀의 스택 오버 플로우와 끝까지. .animate({opacity:"show"}) also call show()`(으)로 전화가 걸려서 작동하지 않습니다. jQuery 코드를 통해 중요한 비트를 추출하여 스택 오버플로가 발생하지 않고 효과를 재현했습니다.

+0

아, 그게 흥미 롭습니다 ...'if ($ .browser.msie && $. browser.version.substr (0,1) <9)'로 어떻게 할 것입니까? – Yahreen