开发者

Canvas element covering the entire screen?

开发者 https://www.devze.com 2023-01-01 00:10 出处：网络

I\'m trying to use <canvas> in iPhone Safari, and if I place the element in the body, there are unused pixels to the left and top of the element. I tr开发者_StackOverflowied specifying margin:0;

相关专题：canvas css javascript

I'm trying to use <canvas> in iPhone Safari, and if I place the element in the body, there are unused pixels to the left and top of the element. I tr开发者_StackOverflowied specifying margin:0;padding:0 with CSS to no avail.

What's going on here?

<html>
<head>
        $(document).ready(function()
        {
            $('#screen').attr("height", $(window).height() );
            $('#screen').attr("width", $(window).width() );

            //prevent scrolling
            $(document).bind('touchstart touchmove', function(e)
            {
                e.preventDefault();
            });
        });
    </script>
</head>
<body>
<canvas id = "screen">
</canvas>
</body>
</html>

margin,padding, and border have no effect.

Use position:absolute; top:0;left:0

add <style>* {margin:0;padding:0;border:0;position:absolute;width:100%;height:100%}</style>