2016-03-29 5 views
-4

ich viel Forschung getan haben, aber ich habe mit leeren Händen auf kommen, was apear würde die banalsten Aufgaben sein:HTML: Wie man eine Leinwand Tag auf die Größe Resize Dem Fenster

Wenn ich eine haben Canvas-Element, das den gesamten Bildschirm einnimmt und der einzige sichtbare HTML-Code ist, wie kann ich dann die Größe des Fensters ändern, so dass es noch bearbeitet werden kann ???

Wenn Sie das für einfach halten, dann versuchen Sie es. Also, was ist ein Beispiel dafür? Habe ich einen kaputten Browser und es ist so einfach wie 100% Größe, oder ist es viel komplizierter?

Auch, wenn es ein Skript in Ihrer Antwort dann bitte halten Sie es einfach javascript ohne jquery, weil ich sicher bin, dass wenn es auch in jquery getan werden kann, dann kann es in guten alten plain javascript getan werden.

Antwort

1

Sie müssen die Standard 5px Marge aus dem Körper zu entfernen, so .

<body style="margin:0px;"> 
    <canvas width="100%" height="100%"> 
Your browser doesn't support the HTML5 canvas 
    </canvas> 
</body> 
+1

Ich hoffe, dies ist hilfreich! –

+2

Sie haben eine wirklich gute Frage gestellt. –

1

Versuch mit CSS:

<canvas style="width: 100%; height: 100%;"></canvas> 

auch sicher, dass alle der übergeordneten Elemente 100% Breite und Höhe machen:

<style> 
html, body { 
    height: 100%; 
    width: 100%; 
} 
</style> 

sicher sein, den Stil-Tag zwischen Ihrem <head> zu platzieren und </head>, können Sie auch das Canvas-Element selbst in Ruhe lassen und fügen Sie dieses einfach Ihrem Kopf anstelle des obigen Codes hinzu:

<style> 
html, body { 
    height: 100%; 
    width: 100%; 
} 

canvas { 
    height: 100%; 
    width: 100%; 
} 
</style> 
Verwandte Themen