Foros del Web » Creando para Internet » CSS »

Banner Flotante

Estas en el tema de Banner Flotante en el foro de CSS en Foros del Web. Bueno amigos esta es la primera vez que posteo por aca y creo que lo hare seguido, ya tengo mucho tiempo visitando la pagina y ...
  #1 (permalink)  
Antiguo 22/08/2011, 00:19
 
Fecha de Ingreso: agosto-2011
Ubicación: Ensenada
Mensajes: 24
Antigüedad: 12 años, 7 meses
Puntos: 0
Pregunta Banner Flotante

Bueno amigos esta es la primera vez que posteo por aca y creo que lo hare seguido, ya tengo mucho tiempo visitando la pagina y la verdad he aprendido un buen de cosas, pero hasta hoy que consegui trabajo tendre que aprender mas... mucho mas..

Bueno mi pregunta es la siguiente muchas veces cuando visito paginas me encuentro con banners que me persiguen (algunos verdaderamente molestos) encontre una manera sensilla de hacerlos, pero resulta que cuando los activo no me deja hacer clicks ni nada en la pagina, lo que use fue en html con css y divs, les dejo los codigos y los links para que puedan ver a lo que me refiero.

La pagina de prueba la pueden ver aki

[URL="http://consultorias.netau.net/prueba"]http://consultorias.netau.net/prueba[/URL]


Este en el Style
Código CSS:
Ver original
  1. .imgcp  {
  2.     position: fixed;
  3.     right: 0%;
  4.     bottom: 0;
  5.     display:block;
  6.     height: 100%;
  7.     width:100%;
  8.     background:url(img/cp.png) top right no-repeat;
  9.     z-index: auto;
  10.     overflow: hidden;
  11. }

Este esta en Body
Código HTML:
<div class="imgcp"><a href="http://www.forosdelweb.com"></a></div> 
¿creen que se pueda hacer algo con este codigo? o es necesario usar js o jquery o algo asi.

Se que si alguien ve el codigo de la pagina me reganara por usar dreamweaver

Saludos...
  #2 (permalink)  
Antiguo 22/08/2011, 00:40
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 13 años, 6 meses
Puntos: 63
Respuesta: Banner Flotante

Buenas, cambia el valor del z-index, por un número decimal que te permita sobreponer tu banner, sobre las demás capas.

Sobre z-index
http://es.html.net/tutorials/css/lesson15.php
  #3 (permalink)  
Antiguo 22/08/2011, 00:58
 
Fecha de Ingreso: agosto-2011
Ubicación: Ensenada
Mensajes: 24
Antigüedad: 12 años, 7 meses
Puntos: 0
Respuesta: Banner Flotante

Cita:
Iniciado por Batan Ver Mensaje
Buenas, cambia el valor del z-index, por un número decimal que te permita sobreponer tu banner, sobre las demás capas.

Sobre z-index
[URL="http://es.html.net/tutorials/css/lesson15.php"]http://es.html.net/tutorials/css/lesson15.php[/URL]
Gracias Amigo me funciono a la primera, me acabo de dar cuenta que el link de la imagen del div no funciona si sabes por que podrias decirme?

Si crees que no deberias :D okey yo lo busco pero muchas gracias por tu auyuda al final fue
Código CSS:
Ver original
  1. z-index: -1;
  #4 (permalink)  
Antiguo 22/08/2011, 01:02
Avatar de Batan  
Fecha de Ingreso: septiembre-2010
Ubicación: Madrid
Mensajes: 408
Antigüedad: 13 años, 6 meses
Puntos: 63
Respuesta: Banner Flotante

Por que el link no hace referencia a nada.

Cita:
<div class="imgcp"><a href="http://www.forosdelweb.com"></a></div>
Osea creas la etiqueta a href pero sin contenido.
La imagen no deberia estar como fondo sino como imagen pura.
Cita:
<div class="imgcp"><a href="http://www.forosdelweb.com"><img src="tu imagen.png" alt="Banner" /></a></div>
Saludos
  #5 (permalink)  
Antiguo 22/08/2011, 01:03
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 2 meses
Puntos: 306
Respuesta: Banner Flotante

Tienes un banner del 100% de la pantalla, mientras que la imagen que muestras debe tener 50px por 50px. Al ocupar toda la pantalla es obvio que no podrás seleccionar nada de lo que haya debajo.
El display:block no es necesario ya que es un div, es decir un elemento de bloque.
Ten en cuenta : La propiedad que controla la posición tridimensional de una caja se denomina z-index y sólo tiene efecto sobre los elementos posicionados, es decir, aquellos sobre los que se ha establecido la propiedad position o la propiedad float. Por su propia definición, z-index sólo suele ser útil cuando se producen solapamientos entre las cajas.

Código CSS:
Ver original
  1. .imgcp  {
  2.     position: fixed;
  3.     right: 0;
  4.     bottom: 0;
  5.     display:block;
  6.     height: 150px;
  7.     width:150px;
  8.     background:url(img/cp.png) top right no-repeat;
  9.     z-index: 50;
  10.     overflow: hidden;
  11. }

y el enlace lo tienes vacio.
Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #6 (permalink)  
Antiguo 22/08/2011, 01:24
 
Fecha de Ingreso: agosto-2011
Ubicación: Ensenada
Mensajes: 24
Antigüedad: 12 años, 7 meses
Puntos: 0
Respuesta: Banner Flotante

Gracias a los dos usuarios que me repondieron las dos respuestas me ayudaron mucho, dejare los codigos finales por si alguien lo ocupa.

Código CSS:
Ver original
  1. .imgcp  {
  2.     position: fixed;
  3.     right: 0;
  4.     top: 0;
  5.     height: 50px;
  6.     width:50px;
  7.     overflow: hidden;
  8.    
  9. }

Código HTML:
Ver original
  1. <div class="imgcp"><a href="http://www.forosdelweb.com"><img src="img/cp.png"/></a></div>

Etiquetas: banner, flotantes
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:53.