Código de JavaScript - canvas en pantalla completa

sin imagen de perfil

canvas en pantalla completagráfica de visualizaciones


JavaScript

Actualizado el 18 de Agosto del 2018 por Anonymous (35 códigos) (Publicado el 20 de Agosto del 2016)
4.970 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
4.971 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
25 de Febrero del 2017
estrellaestrellaestrellaestrellaestrella
esto es para aplicarlo en cualquier canvas de el documento
1
2
// 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...
CerrarCerrar
CerrarCerrar
Cerrar

Tienes que ser un usuario registrado para poder insertar imágenes, archivos y/o videos.

Puedes registrarte o validarte desde aquí.

Codigo
Negrita
Subrayado
Tachado
Cursiva
Insertar enlace
Imagen externa
Emoticon
Tabular
Centrar
Titulo
Linea
Disminuir
Aumentar
Vista preliminar
sonreir
dientes
lengua
guiño
enfadado
confundido
llorar
avergonzado
sorprendido
triste
sol
estrella
jarra
camara
taza de cafe
email
beso
bombilla
amor
mal
bien
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s3638