캔버스 크기를 조정할 때 스크롤 막대가 나타나는 이유는 무엇입니까?

캔버스가 창을 채우는 페이지를 만들었습니다. 그것은 작동하지만 어떤 이유로 스크롤바가 나타납니다. 나는 무엇이 오류인지 모른다.캔버스 크기를 조정할 때 스크롤 막대가 나타나는 이유는 무엇입니까?

<!doctype html> 
<html> 

    <head> 
    <title>test</title> 
    <meta charset="utf-8" /> 
    <style type="text/css"> 
     #canvas { 
     background-color: #EEEEEE; 
     } 
     * { 
     margin: 0px; 
     } 
    </style> 
    <script type="text/javascript"> 
     function getSize() { 
     var myWidth = 0, myHeight = 0; 
     if(typeof(window.innerWidth) == 'number') { 
      //Non-IE 
      myWidth = window.innerWidth; 
      myHeight = window.innerHeight; 
     } else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) { 
      //IE 6+ in 'standards compliant mode' 
      myWidth = document.documentElement.clientWidth; 
      myHeight = document.documentElement.clientHeight; 
     } else if(document.body && (document.body.clientWidth ||   document.body.clientHeight)) { 
      //IE 4 compatible 
      myWidth = document.body.clientWidth; 
      myHeight = document.body.clientHeight; 
     } 
     return {x:myWidth,y:myHeight}; 
     } 

     window.onload = function() { 
     canvas = document.getElementById('canvas'); 
     var size = getSize(); 
     canvas.width = size.x; 
     canvas.height = size.y; 
     }; 
    </script> 
    </head> 

    <body> 
    <canvas id="canvas" width="200" height="200"></canvas> 
    </body> 

</html>

출처

2012-02-12 Danny Fox

는 나를 위해 트릭을했다 : 그것은을 가지고 있으므로 특히

#canvas { 
    display: block; 
    background-color: #EEEEEE; 
}

출처

2012-02-12 21:33:22 fixlr

을, 캔버스는 인라인 요소이며, 다른 모든 인라인 요소와 마찬가지로 기준선. 따라서 코드는 창의 크기만큼 캔버스를 만들지 만, 블록의 맨 위에있는 기준선에 있어야합니다. 이 경우 캔버스의 수직 정렬을 변경하면 효과가 있지만 'display : block;'이 더 나은 해결책입니다. – Neil

CSS에 문제가있는 것 같습니다.

필자는 '모든 요소'를 맨 위로 옮기고 캔버스를 안전을 위해 절대 배치했습니다.

이 작동하는지 알려줘 : 블록에 #canvas 전환

<style type="text/css"> 
      * { 
       margin: 0px; 
       padding:0px; 
      } 
      #canvas { 
       position:absolute; 
       left:0px; 
       top:0px; 
       background-color: #EEEEEE; 
      } 

</style>

출처

2012-02-12 21:02:30

캔버스 크기를 조정할 때 스크롤 막대가 나타나는 이유는 무엇입니까?

답변

관련 문제