jQuery.css() : Firefox가 '자동'값을 반환하지 않습니다.

Question

위쪽 또는 아래쪽 및 왼쪽 또는 오른쪽 값을 몇 가지 요소로 설정합니다. 내가 파이어 폭스 (16.0.2)로이 값에 액세스하려고 해요 때, 나는

div { 
    bottom:200px; 
    left:0px; 
    top:auto; 
    right:auto; 
} 

JS

top에 대한 잘못된 값 (대신 auto의 특정 값)

CSS를 얻을 수

$(function(){ var top = $('div').css('top'); alert(top); });​ 

당신은 여기를 시도 할 수 있습니다 : http://jsfiddle.net/UEyxD/2/는

01 (크롬/사파리에서 잘 작동)

어떤 아이디어가 이것을 방지하는 방법? 내가 가고 싶다

Answer 1

이것은 브라우저에 달려 있으며 스타일을 해석하는 방법과는 다소 차이가 있습니다. 그러나 특정 CSS 및 jQuery 해결 방법을 사용하면 문제를 해결할 수 있습니다. 예를 들어 항목을 절대적으로 배치 할 필요가없는 경우이 항목을 제거하거나 position:static;으로 변경하십시오.

question을 살펴보세요.

크롬과 IE가 다른 값을 반환 할 이유에

: .CSS는() 브라우저 '계산 된 스타일의 기능에 통합 게이트웨이를 제공하지만 브라우저가 실제로 스타일을 계산하는 방법을 통일하지 않습니다. 브라우저가 이러한 엣지 케이스를 다르게 결정하는 경우는 드물지 않습니다. 입니다.

Answer 2

position 스타일을 제거하면 계산 된 값 대신 이됩니다.

div { 
    top: auto; 
    bottom:20px;  
    right:20px; 
    left:0px; 
} 

here을 테스트 할 수 있습니다.

Answer 3

당신이 코드 아래에 '자동'을 설정할 때 상단의 정수 값을받을 수

:

$(function(){ 
    var top = $('div').offset().top; 
    alert(top); 
});​ 

• 오프셋 반환 위치 값이 자동
로 설정

Answer 4

나는 또한 있었다 이 성가신 문제.

일부 브라우저는 요소가 현재 표시되어있는 경우 계산 된 위치를 반환합니다. 트릭은 그것을 숨기고, css를 읽은 다음 다시 볼 수있게하는 것입니다 (아직 숨겨져 있지 않다면).

나는 이것을 처리하고 Firefox에서 auto을 반환 할 편리한 함수를 작성했습니다.

var getCss = function($elem, prop) { 
     var wasVisible = $elem.css('display') !== 'none'; 
     try { 
      return $elem.hide().css(prop); 
     } finally { 
      if (wasVisible) $elem.show(); 
     } 
    }; 


alert(getCss($('div'), 'top')); 

finally

jsFiddle

은 바로 함수가 반환하기 전에, 다시 요소에 대한 가시성을 가지고하는 것입니다.

이 기능은 auto이 반환 될 것으로 예상되는 상황에서만 사용해야합니다.