Cómo ocultar banners en pantallas pequeñas con código HTML

vbluis · 27 Jul 2015

Hola amigos, quisiera hacer una consulta sobre HTML a ver si puede ayudarme alguien.

Tengo un blog con unos banners laterales, esos banner tienen un código como este:

HTML:

<a	href="www.web_de_destino_del_banner.com"	target='_blank'	onClick="_gaq.push(['_trackEvent','banner','clic','nombre_para_analytics',0,	true]);"><img	src="imagen_del_banner.png"	style="position:	fixed;	top:	320px;	left:	5px;"	alt=""	/</a>

Se trata de una imagen subida a mi servidor, un código de analytics para medir la cantidad de clics, y la URL de destino del banner.

Pero claro, en móviles tambien aparecen los banner y apenas dejan espacio.

Antes un programador me puso un par de lineas de código para evitar que saliera el banner, pero tras actualizar el theme se borro y ahora no sé como lograrlo.

Quisiera que no aparecieran esos banner si la resolución de la pantalla es inferior a XXX pixels.

Muchas gracias

Sonny · 27 Jul 2015

Te refieres esto?

HTML:

<style>@media (max-width: 400px) {  img{    display: none;  }}</style>

Igual deberías tener un diseño Responsive, que se adapte a todos los dispositivos.

Y se logra utilizando el width y hight en %. ejemplo

<img src="imagen_del_banner.png" style="width: 30%; position: fixed; top: 320px; left: 5px;" alt="" />

vbluis · 28 Jul 2015

Gracias amigo, lo pruebo y te respondo si era esto 🙂

Aprovechando la ayuda (espero no abusar), si quiera limitar también la aparición del banner a IPs de un determinado pais (por ejemplo solo españolas), sería cuestión de modificar este código que me has facilitado o sería otro código totalmente diferente?

Gracias 🙂

Sonny · 28 Jul 2015

En ese caso ya utilizarías otro código en base a PHP, ya que es la única forma de saber que la visita de tu sitio web de que pais proviene.

vbluis · 28 Jul 2015

p4rp4d30 dijo:
En ese caso ya utilizarías otro código en base a PHP, ya que es la única forma de saber que la visita de tu sitio web de que pais proviene.

Gracias, me puedes indicar alguna página o código de ejemplo donde pueda utilizar ese código?

Muchas gracias

Sonny · 28 Jul 2015

vbluis dijo:
Gracias, me puedes indicar alguna página o código de ejemplo donde pueda utilizar ese código?

Muchas gracias

Es algo muy sensillo lo que deberias usar o hacer.

Mira solo busca en google GEOIP PHP y ahi te saldrán la información que necesitas para lo que pides.

Jcmalco · 30 Jul 2015

lo manejarias por hojas de estilo (CSS):
[MENTION=16931]medi[/MENTION]a (max-width: 250px) {

}

o directamente en el html con un atributo style=""

Hid3N · 2015-08-17T06:16:35-0500

Si usas bootstrap usa la clase "hidden-xs" y directamente cuando esté pekeñico se esconderá

vbluis · 2015-08-17T08:23:11-0500

Gracias amigos

Cómo ocultar banners en pantallas pequeñas con código HTML

vbluis

Sonny

vbluis

Sonny

vbluis

Sonny

Jcmalco

Hid3N

vbluis

Temas similares