2013-09-27 120 views
6
<body style="width:1000px;height:1000px;"> 
    <div id="d" style="display:inline-block;"> 
     <svg id="s" xmlns="http://www.w3.org/2000/svg" version="1.1" width="200px" height="200px"> 
      <rect width="200px" height="200px" style="fill:rgb(0,0,255);"/> 
     </svg> 
    </div> 
</body> 

var div = document.getElementById('d'); 
var rect = div.getBoundingClientRect(); 

alert(rect.width); //200 
alert(rect.height); //205 (in safari), 204.5 in other browsers 

var svg = document.getElementById('s'); 
var rect = svg.getBBox(); 

alert(rect.width); //200 
alert(rect.height); //200 

Tôi đang cố gắng lấy chiều rộng và chiều cao của div mẹ. Vì lý do gì, getBoudingClientRect cho tôi giá trị chiều cao không chính xác (205 hoặc 204.5) Chiều rộng là chính xác, nhưng chiều cao bị tắt. Bất kỳ ý tưởng?getBoundingClientRect, giá trị độ cao không chính xác cho nội tuyến SVG

http://jsfiddle.net/jTvaF/5/

+0

Chiều cao là chính xác, cao 204,5 pixel. – Stijn

+0

phải là 200px – user2800679

+3

bản sao có thể có của [Có khoảng cách 4px bên dưới phần tử canvas/video/âm thanh trong HTML5] (http://stackoverflow.com/questions/8600393/there-is-a-4px-gap-below- canvas-video-audio-elements-in-html5) – Stijn

Trả lời

3

Cho svg thuộc tính display: block; và nó sẽ bắt đầu xuất ra chính xác.

Các vấn đề liên quan