Código de JavaScript - canvas en pantalla completa

Imágen de perfil
Val: 597
Bronce
Ha disminuido 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

canvas en pantalla completagráfica de visualizaciones


JavaScript

estrellaestrellaestrellaestrellaestrella(4)
Actualizado el 18 de Agosto del 2018 por Humberto (Publicado el 20 de Agosto del 2016)
3.344 visualizaciones desde el 20 de Agosto del 2016
el código lo que hace es ponerte la pantalla de canvas a pantalla completa de el navegador
nota:quiero agregar que el código no es mio solamente es que lo quiero compartir con ustedes para que no batallen en la creación de sus juegos xd
Captura-de-pantalla-26

Requerimientos

Navegadores web compatibles, o posteriores obligatorio
Google Chrome 4.0
Internet Explorer/Edge 9.0
Firefox 2.0
Safari 3.1
Opera 9.0

Si es de tu ayuda y quieres aprender mas visita:
https://www.youtube.com/channel/UCWSKQyNDhvBVrddHIhzx5Zg?view_as=subscriber

1.0
estrellaestrellaestrellaestrellaestrella(4)

Actualizado el 9 de Septiembre del 2018 (Publicado el 20 de Agosto del 2016)gráfica de visualizaciones de la versión: 1.0
3.345 visualizaciones desde el 20 de Agosto del 2016
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

te pone el canvas a pantalla completa!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
/*
 * Funcion que permite escalar un elemento
 * a pantalla completa y pocisionarlo en 
 * el centro del documento.
 * 
 * autor: Pablo Elias Pineda
 */
 
function autoScale(id) {
 
	var d = document, E, iw = window.innerWidth,
		ih = window.innerHeight, X, Y, scale;
 
	if(typeof id == 'object') E = id;
	else E = d.getElementById(id);
 
	X = iw/2 - E.width/2; // centro en x
	Y = ih/2 - E.height/2;// centro en y
 
	if (iw/E.width > ih/E.height) {
		scale = ih/E.height;
	} else if (iw/E.width < ih/E.height) {
		scale = iw/E.width;
	} else {
		scale = 1;
	}
	document.getElementsByTagName("html")[0].style.overflow = "hidden";
 
	// acomodar en el centro y escalar a pantalla completa
	E.style.transform = 'translate('+X+'px,'+Y+'px) scale('+scale+')';
	document.body.width = iw;
 
	// para que se ejecute al cambiar el tamaño de la ventana
	window.onresize = function (event) {
		autoScale(id);
	}
 
}



Comentarios sobre la versión: 1.0 (4)

Imágen de perfil
19 de Noviembre del 2016
estrellaestrellaestrellaestrellaestrella
Muy útil para adaptarlo y experimentar...

Gracias por compartirlo.
Responder
Imágen de perfil
25 de Febrero del 2017
estrellaestrellaestrellaestrellaestrella
esto es para aplicarlo en cualquier canvas de el documento
// pantalla completa
autoScale(canvas);
la id del cambas debe ser "canvas"
Responder
Imágen de perfil
19 de Octubre del 2017
estrellaestrellaestrellaestrellaestrella
Hola, esta interesante, no dejas de sorprender.
Yo tengo un problema con un puzzle que estoy creandopara mi niño, kiza puedas ayudarme.
Se trata de mover las piezas para conseguir una imagen, pero no consigo que me avise( quiero crear un evento para cuando se complete y un alert para continuar con otro nivel)
Sigo estudiando, pero al ritmo ke voy, lo terminara el antes que yo.
Lo voy a poner en el foro de javascript, con el titulo " añadir funciones a mi rompecabezas",
por si te animas a escharme una mano.
Un saludo y sigue asi fenomeno
Responder
Imágen de perfil
16 de Septiembre del 2018
estrellaestrellaestrellaestrellaestrella
No ha dejado ningún comentario
Responder

Comentar la versión: 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s3638