Foros del Web » Creando para Internet » HTML »

Como hacer este tipo de anuncios

Estas en el tema de Como hacer este tipo de anuncios en el foro de HTML en Foros del Web. Buenas! Estoy intentando armar un estilo de anuncios como los que se ven aca http://www.psicofxp.com/ Que cuando pasas por encima se abre por sobre el ...
  #1 (permalink)  
Antiguo 06/07/2010, 22:19
Avatar de Zuker  
Fecha de Ingreso: marzo-2007
Ubicación: Argentina
Mensajes: 164
Antigüedad: 17 años
Puntos: 1
Como hacer este tipo de anuncios

Buenas!

Estoy intentando armar un estilo de anuncios como los que se ven aca

http://www.psicofxp.com/



Que cuando pasas por encima se abre por sobre el sitio, tapando contenido sin desplazar el esquema para abajo.

Yo intente hacer

Código CSS:
Ver original
  1. .push_940_300_cont {
  2.     background:#FFF;
  3.     padding-top:10px;
  4.     padding-left:12px;
  5.     padding-right:10px;
  6.     width:938px;
  7.     height:50px;
  8. }
  9. .push_940_300 {
  10.     position:absolute;
  11.     height:50px;
  12.     overflow:hidden;
  13.     visibility:visible;
  14.     z-index:0;
  15. }
  16. .push_940_300:hover {
  17.     height:300px;
  18.     z-index:999;
  19. }

Código HTML:
Ver original
  1. <div class="push_940_300_cont">
  2.     <div class="push_940_300">
  3.         Codigo del anuncio
  4.     </div>
  5. </div>

Pero no logro que funcione del todo bien.

Hay alguna forma de hacerlo con jquery sencillo y bonito? Desconozco realmente

Gracias

Saludos!
  #2 (permalink)  
Antiguo 07/07/2010, 00:52
Avatar de highlord  
Fecha de Ingreso: noviembre-2007
Ubicación: Argentina
Mensajes: 353
Antigüedad: 16 años, 3 meses
Puntos: 16
Respuesta: Como hacer este tipo de anuncios

mira yo no entiendo mucho de js pero si de algo te sirbe te paso hasta donde llegué desmenuzando la web que está en ese link que mostrste.

en primer lugar fui limpiando cod. hasta llegar a dejar en el html solo los script fundamentales para el funcionamiento de ese banner swf que se despiega. Cualquier partecita del siguiente cod. que se eliminea, el baner deja de funcionar.

Y me quedó esto:

<html>
<head>

</head>
<body>
</div>
<div id="eplAdDiv998x50" style="float:left;margin-bottom:15px;"></div>

<script type="text/javascript" language="javascript">
var seccionEplanning = "home";
var kwsEpl = {kw : "valor"};
var arrayPosiciones = ["a300x250", "998x50", "300x100", "b300x250", "richmedia", "468x280"];
</script>

<script type="text/javascript" src="http://www.psicofxp.com/static/js/epl_nl.js"></script>
<script type="text/javascript">
eplAD4M("a300x250");
eplAD4M("998x50");
eplAD4M("300x100");
eplAD4M("b300x250");
eplAD4M("richmedia");
eplAD4M("468x280");
</script>

</body>
</html>


--------------------------------------------------

Como puedes ver al parecer no le hace falta nada entre las etiquetas head (esto está probado en mi servidor y funcionó tal cual en la pag. de origen)

Entonces noté que en todo ese cod se esta utilizando un script alojado en la direccion que marque con rojo.

descargue el script y encontre lo que podrás ver si ingresas a esa dirección.

Luego para probarlo copie todo en un txt le di codificacion UTF-8 por las dudas

Y subil el .js conjuntamente con el html que te mostre en un principio y andubo de 10.

Bueno ahora el tema es que de ese .js sinceramente yo no entiendo absolutamente nada, no logro comprender de donde rescata el flash, es decir donde se modificaría algun parametro o un ID para alojar luego un swf propio y que funsione.

Lo que pasa acá es que ese cod alojado en un servidor propio tanto en el mio como en el de cualquier webmaster, está tomando los datos del swf alojado en algún vendito lugar y no se como lo hace, además tambien me parece que se vale de algun otro .js para llamar a esa función en fin para mi es chino!!!
asique si lográs decifrar algo de todo este matete que te hice por favor avisá porque por si no te diste cuenta, yo tambien estoy buscando lo mismo jajajaja!!!
Saludos.

Highlord.
__________________
Lo poco que sé, lo comparto!!! ;)
---------------------------------------------
http://www.dsweblp.com.ar
  #3 (permalink)  
Antiguo 07/07/2010, 05:38
Avatar de Wasper  
Fecha de Ingreso: julio-2006
Ubicación: de cai, picha!!!
Mensajes: 1.030
Antigüedad: 17 años, 8 meses
Puntos: 41
Respuesta: Como hacer este tipo de anuncios

Se que no ayudare en mucho con este comentario, pero no hay nada que me fastidie mas que me pongan un anuncio por encima de un contenido, porque ya no se conforman con su espacio publicitario si no que tambien se dedican a invadir el espacio vital...

Es como si estas comiendo en algun restaurante y alguien te pone una publicidad encima de las papas fritas...

Eso se consigue con JS, busca Divs dinamicos...
__________________
Saludos, Jose

Paginas web y SEO
Anuncios por palabras
  #4 (permalink)  
Antiguo 08/07/2010, 16:22
Avatar de Zuker  
Fecha de Ingreso: marzo-2007
Ubicación: Argentina
Mensajes: 164
Antigüedad: 17 años
Puntos: 1
Respuesta: Como hacer este tipo de anuncios

Buenas!

Al final Me puse a hacerlo con css... uso jquery nomas para que se cargue luego de que carga todo el sitio, pero no es necesario. Creo que estoy cerca.

Aca tengo una demo donde pueden verlo

http://www.taringacs.net/desarrollo/demo.php

Código CSS:
Ver original
  1. #push_940_300_load {
  2.     background:#FFF;
  3. }
  4. .push_940_300_cont {
  5.     padding-top:10px;
  6.     background:#FFF;
  7.     width:938px;
  8.     height:50px;
  9.     display:none;
  10. }
  11. .push_940_300 {
  12.     padding-left:12px;
  13.     padding-right:10px;
  14.     position:absolute;
  15.     height:50px;
  16.     z-index:1;
  17.     overflow:hidden;
  18. }
  19. .push_940_300:hover {
  20.     position:absolute;
  21.     height:300px;
  22.     z-index:999;
  23. }

En FF y en Chrome se ve bien. El tema esta al hacer el mouseover en Explorer.

Si le saco el overflow:hidden se ve bien, pero no me permite navegar por el contenido donde esta el texto

Alguna idea?

Gracias! Saludos

Etiquetas: anuncios, tipo
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 06:55.