Firefox에서이 JavaScript 코드가 글꼴 크기를 늘리는 이유는 무엇입니까?

이 자바 스크립트 코드를 사용하여 스팬의 텍스트 글꼴 크기를 늘려서 부모 div를 채 웁니다.Firefox에서이 JavaScript 코드가 글꼴 크기를 늘리는 이유는 무엇입니까?

function maximise_font(the_span, the_div, the_fontsize) { 
     var fontSize = the_fontsize;      
     var ourText = the_span; 
     var maxHeight = the_div.height(); 
     var maxWidth = the_div.width(); 
     var textHeight; 
     var textWidth; 
     do { 
      ourText.css('font-size', fontSize); 
      textHeight = ourText.height(); 
      textWidth = ourText.width(); 
      fontSize = fontSize - 1; 
     } while (textHeight > maxHeight || textWidth > maxWidth && fontSize > 3); 
    }

Firefox에서는 제대로 작동하지만 Chrome에서는 제대로 작동하지 않습니다. Chrome에서 내부 루프는 Firefox에서와 동일한 양으로 실행되지만 글꼴 크기는 전혀 변경되지 않습니다. 왜 그런가요? 당신은 단위 유형 지정해야

ourText.css('font-size', fontSize);

ourText.css('font-size', fontSize + "px");

나는 파이어 폭스를 추측하고있어 그냥하고있다

출처

2011-03-17 ben

나는 현재 루프가 끝날 때까지 CSS 스타일을 적용하지 않는 브라우저가 있기 때문에 jQuery – thomasrutter

afaik라고 가정하고 있습니다. 그래서 각 루프에서 'font-size'가 적용되지만 렌더링되지 않으므로 textHeight와 width가됩니다. 루프가 종료 할 때까지 각 루프마다 동일합니다 ... – Ozzy

이 함수에 전달할 값이 무엇인지는 명확하지 않습니다. 이렇게하면 문제를 이해하는 데 도움이됩니다. – thomasrutter

ourText를 가정하면, 그것은이 라인과 같은 jQuery를 객체 보인다는 문제입니다 당신을위한 몇 가지 가정.

출처

2011-03-17 04:17:55

html이 어떻게 보이는지 보여 줄 수 있습니까? 나는 그것을 여기에서 시험한다. 그리고 그것은 firefox와 크롬을 위해 잘 작동한다.

출처

2011-03-17 04:41:05 Davuth

Firefox에서이 JavaScript 코드가 글꼴 크기를 늘리는 이유는 무엇입니까?

답변

관련 문제