• Publicidad
  • Contacto
Pixelco Tech News
  • Noticias
  • Video
  • Tecnología
    • Audio & Video
    • LifeStyle
    • Transformación Digital
  • Ciencia
    • Ciencia Ficción
  • Fotografía
  • Internet
    • Desarrollo/programación
    • Diseño
Sin resultados
Ver todos los resultados
Pixelco
  • Noticias
  • Video
  • Tecnología
    • Audio & Video
    • LifeStyle
    • Transformación Digital
  • Ciencia
    • Ciencia Ficción
  • Fotografía
  • Internet
    • Desarrollo/programación
    • Diseño
Sin resultados
Ver todos los resultados
Pixelco
Sin resultados
Ver todos los resultados

Cómo detectar la orientación del dispositivo con HTML5

Diego CambiasoporDiego Cambiaso
06/03/2018
enDesarrollo/programación, Internet, Recursos, Tecnología
Tiempo de lectura2 minutos
Cómo detectar la orientación del dispositivo con HTML5
Compartir en FacebookCompartir en TwitterCompartir en WhatsappCompartir en TumblrCompartir en Telegram

Una de las características que más se ha hablado de HTML5, es sin dudas sobre la posibilidad de reproducir audio y video nativamente, es decir sin la necesidad de plugins de terceros. Curiosamente, una característica muy sorprendente y de la que poco se ha hablado, es la de detectar la orientación del dispositivo.
Cómo detectar la orientación del dispositivo con HTML5

Equipos como un MacBook, iPhone, iPads, smatphones Nokia, Smartphone con Android (hasta mi antiguo Nokia N95) y casi cualquier smartphone/tablet que se vende en la actualidad incorporan un acelerómetro y/o giroscopio.

Un acelerómetro es un instrumento que mide aceleraciones. Por ejemplo en el caso de un Macbook se utiliza para detectar si el equipo está cayendo y así minimizar el daño en disco duro.

Todo esto permite por ejemplo usar los juegos del iPhone y/o iPad donde no hay palanca de mando sino que con el mismo dispositivo, se controla el juego según la posición.

Contenidorelaciondo

Chat-GPT 4 la IA más avanzada de OpenAI, conoce todas las novedades y funciones nuevas

14/03/2023

Llega a Colombia app que permite escuchar música sin costo, sin interrupciones y sin conexión a Internet

08/03/2023

Galaxy S23 Ultra ¿Qué tan bueno es?

28/02/2023

Samsung complementa su portafolio gamer en Colombia con el primer monitor OLED Odyssey G8  

27/02/2023

HMTL5 está permitiendo a los programadores hacer aplicaciones verdaderamente potentes y que hasta funcionan sin conexión a Internet. Sin combinamos tecnologías como SVG y device orientation o detección de la orientación del dispositivo, pronto estaremos creando juegos similares a los que se desarrollan con lenguajes como C/C++ con sólo tecnología web.

En HTML5, detectar la orientación del dispositivo es tan sencillo como se ve en el código Javascript del siguiente ejemplo:

window.addEventListener('deviceorientation', function(event) {
var a = event.alpha;
var b = event.beta;
var g = event.gamma;
}, false);

Para que puedan ver en funcionamiento un demo funcional, gravé el siguiente video:

[youtube]http://www.youtube.com/watch?v=-kWtmJSKfeg&feature=colike[/youtube]

Si estás interesado en HTML5, te recomiendo estas otras entradas:

Conoce las ventajas de las aplicaciones web

Conoce las ventajas de las aplicaciones web
Conoce las ventajas de las aplicaciones web

5 Cosas que deberías saber sobre HTML5

5 Cosas que deberías saber sobre HTML5
5 Cosas que deberías saber sobre HTML5

3 Recursos para aprender HTML5

3 Recursos para aprender HTML5
3 Recursos para aprender HTML5

Fuente de referencia de esta entrada: HTML5 Rocks

Tags: desarrollowebdevice orientationhtmlHTML5orientacion del dispositivoprogramacion webRecursosVideo
Diego Cambiaso

Diego Cambiaso

Comunicador Social, Desarrollador de Software y UX Designer Blogger desde el 2006, creador de Pixelco Tech News. Viajero y fotógrafo. Entusiasta del diseño, apasionado por la tecnología y el social media. EN-ES-IT

Contenido Relacionado

Tecnología

Chat-GPT 4 la IA más avanzada de OpenAI, conoce todas las novedades y funciones nuevas

14/03/2023
Audio & Video

Llega a Colombia app que permite escuchar música sin costo, sin interrupciones y sin conexión a Internet

08/03/2023
Video

Galaxy S23 Ultra ¿Qué tan bueno es?

28/02/2023
Cargar más

Pixelco Tech

Pixelcoes sitio de noticias de tecnología, diseño y desarrollo web e Internet escrito por profesionales.

Objetivo de Pixelco

Informar, promocionar, proporcionar recursos y ayuda sobre el diseño y desarrollo web, estándares, Internet y tecnología.

  • Contacto
  • Publicidad
  • Sobre Pixelco
  • Política de Privacidad

© 2023 Pixelco Tech News - Internet & Tecnología - Por Diego Cambiaso.

Sin resultados
Ver todos los resultados
  • Publicidad
  • Contacto
  • Política de Privacidad
  • Sobre Pixelco
  • Internet
    • Recursos
    • Diseño
    • Desarrollo/programación
  • Tecnología
  • Noticias
  • Fotografía

© 2023 Pixelco Tech News - Internet & Tecnología - Por Diego Cambiaso.

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In

Add New Playlist

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies Política de privacidad.
 

Cargando comentarios...