Comunidad de diseño web y desarrollo en internet online

¿Como lo hago?

Citar            
MensajeEscrito el 15 Sep 2009 11:17 pm
Hola muy buenas, me presento:
Me llamo óscar y soy de Valladolid, llevo poco tiempo en esto de la informática, y de códigos muy poco. He desarrollado una página web, la cual esta funcionando bastante bien. El problema ha surgido que ahora el presidente del Club, quiere que se ponga publicidad, de los patrocinadores del mencionado Club. Entonces yo encontre este script:
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT>
var popwindow
var popwindowwidth=480
var popwindowheight=80
var popwindowtop=20
var popwindowURL="publi_"+numeroAleatorio()+".html"
var waitingtime=4
var pause=20
var step=40
var popwindowleft=-popwindowwidth-50
var marginright
var pagecenter
var timer

waitingtime= waitingtime*1000;

function showWindow() {
//alert(popwindowURL);
popwindow = window.open(popwindowURL, "popwindow", "toolbar=no,width="+popwindowwidth+",height="+popwindowheight+",top="+popwindowtop+",left="+(-popwindowwidth)+"");
if (document.all) {
marginright = screen.width+50;
}
if (document.layers) {
marginright = screen.width+50;
}
pagecenter=Math.floor(marginright/2)-Math.floor(popwindowwidth/2);
movewindow();
}

function movewindow() {
if (popwindowleft<=pagecenter) {
popwindow.moveTo(popwindowleft,popwindowtop);
popwindowleft+=step;
timer= setTimeout("movewindow()",pause);
}
else {
clearTimeout(timer);
timer= setTimeout("movewindow2()",waitingtime);
}
}

function movewindow2() {
if (popwindowleft<=marginright) {
popwindow.moveTo(popwindowleft,popwindowtop);
popwindowleft+=step;
timer= setTimeout("movewindow2()",pause);
}
else {
clearTimeout(timer);
popwindow.close();
}
}

function numeroAleatorio(){
return Math.round(Math.random()*30+1).toString();
}

// -->
</SCRIPT>
</HEAD>
<BODY ONLOAD="showWindow()"> </BODY>
El cual lo que hace es que abre un popup (aleatoriamente, es decir cada vez sale un patrocinador distinto) desde el lado izquierdo y se desplaza hasta el lado derecho para luego desaparecer, esto solo en explorer, ya que en firefox solo sale en el lado izquierdo, pero bueno esa es la menor de las pegas, ya que por lo menos sale el patrocinador.
La verdadera pega es que según vas recorriendo la página, este popup en la segunda página ya no se ve la publicidad en primer plano, simplemente da una especie de pantallazo como que lo ha cargado, pero sin aparecer como si se hubiera quedado por detras de la ventana principal. Como le comento esto solo en firefox, ya que en explorer sale correctamente.
¿Que solución ó alternativa me da para lo que pretendo mostrar?. O digammen si hay otro tipo de script que realize la función aleatoria, quees la que más llama la atención, y que almismo tiempo cumpla las otras dos caracteristicas, una que se vea en firefox y la otra que no se quede por detras de la ventana. Espero me ayude pues estoy algo desesperado, y bastante harto de haber buscado por tropecientosmil sitios y ninguno dar una explicación coherente. Y para más horror dentro de nada empieza ya la temporada de fútbol. Imaginense que plan.
En espera de su contetación y reciba un cordial saludo, atentamente:

Óscar

Por martgall4

3 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 16 Sep 2009 10:32 pm
Para solucionar tu problema debes hacer lo siguiente:

1. Presumo que lo estas haciendo es cargar una imagen ya sea esta JPG, PNG, o GIFo un SWF dentro de un archivo HTML el cual cargas dentro de tu pop-up, de ser este el caso, deja solo las imagenes como archivos suletos dentro de un directorio llamado "banners", de no ser el caso y tus pop-ups de banner son paginillas con codigo HTML texto y demas cosas, cnoviertelo todo a una imagen o aun SWF y repite el paso anterior, para tu propia comodidad te recomiento que todo sea o bien JPG o bien PNG o GIF o SWF pero no combines, adicional a eso trata que todos tus banners tengan el mismo tamaño.
2. Bajate el framework jQuery desde aqui
3. Cargar este script en todas tus paginas dentro de la etiqueta HEAD

Código HTML :

<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" >
function aleatorio(inferior,superior){ 
    numPosibilidades = superior - inferior 
    aleat = Math.random() * numPosibilidades 
    aleat = Math.round(aleat) 
    return parseInt(inferior) + aleat 
};
$(document).ready(function(){
function open_banner() {
  $banners      = new Array("banner1","banner2","banner3","banner4","banner5"); //Matriz que contiene el nombre de las imagenes de cada banner sin su extension
   $nombres      =   new Array("nombre1","nombre2","nombre3","nombre4","nombre5"); //Matriz con los nombres alternativos para cada banner campo "alt" en caso no cargue la imagen
   $urls            =   new Array("url1","url2","url3","url4","url5");                        //Matriz con las URL's a las que se vinculan cada banner en caso de no haber URL colocar "#"
   $tamanyo      = $banners.length-1;                                                                  //Obtiene la longitud de la Matriz banners y le resta 1
   $aleat         =   aleatorio(0,$tamanyo);                                                            //Obtiene un numero aleatorio entre 0 y el $tamanyo el cual representa al indice de matriz que se usara para
                                                                                                                     //mostrar el banner
   $exist         =   $('#pop-up').length;                                                               //Cuenta cuantos elementos con id=popo-up existen
   $alto            =   75;                                                                                          //alto del banner
   $ancho         =   300;                                                                                       //ancho del banner
   $mover         =   2;                                                                                          //a mayor valor el banner se desplazara más pixeles y por tanto más rápido
   $acel            =   25;                                                                                          //a mayor valor el banner se movera más rápido
   $desvanece   = 3000;                                                                                       //Tiempo en milisegundo que demora el banner en empezar a desaparecer una vez que llega a la posicion final
   $demora         =   30;                                                                                          //Tiempo en segundos que demora en aparecer el siguiente banner despues de desaparecer el anterior
   if ($exist==0) {                                                                                           //Comprueba la existencia del pop-up, de existir solo cambia su contenido
      $('body').append('<div id="pop-up" style="position:fixed; top:10px; left:10px; width:'+$ancho+'px; height:'+$alto+'px; z-index:99999; background-color:#333; overflow:hidden;"><div id="close_pop" style="text-align:center; font-weight:bold; position:absolute; top:1px; left:'+($ancho-15)+'px; z-index:999999; border:1px solid #FFF; color:#FFF; font-size:9px; background-color:#000;">&nbsp;X&nbsp;</div><img src="'+$banners[$aleat]+'.jpg" alt="'+$nombres[$aleat]+'" style="width:'+$ancho+'px; height:'+$alto+'px; border:none;" /></div>');
   } else {
      $('#pop-up').html('<div id="close_pop" style="text-align:center; font-weight:bold; position:absolute; top:1px; left:'+($ancho-15)+'px; z-index:999999; border:1px solid #FFF; color:#FFF; font-size:9px; background-color:#000;">&nbsp;X&nbsp;</div><img src="'+$banners[$aleat]+'.jpg" alt="'+$nombres[$aleat]+'" style="width:'+$ancho+'px; height:'+$alto+'px; border:none;" />').css({'top':'10px','left':'10px'}).show();
   };
   $('#close_pop').mouseover(function(){$(this).css('cursor','pointer');}).click(function(){$('#pop-up').fadeOut('slow');});
   $('#pop-up > img').mouseover(function(){$(this).css('cursor','pointer');}).click(function(){window.open($urls[$aleat],'sponsor');clearInterval($time1);$('#pop-up').hide();});
   
   function mover1(){
      $val0   =   $('#pop-up').css('left');
      $val0   =   $val0.split("px");
      $val0   =   eval($val0[0])+$mover;
      $('#pop-up').css('left',$val0+'px');
      $val1   =   $('#pop-up').css('left');
      $val1   =   $val1.split("px");
      $val1   =   $val1[0];
      $val2   =   $(document).width();
      $val3   =   $('#pop-up').css('width');
      $val3   =   $val3.split("px");
      $val3   =   $val3[0];
      if ($val1>=($val2-$val3-20)) {
         clearInterval($time1);
         $time2   =   setInterval(mover2,$acel);
      };
   };
   
   function mover2(){
      $val0   =   $('#pop-up').css('top');
      $val0   =   $val0.split("px");
      $val0   =   eval($val0[0])+$mover;
      $('#pop-up').css('top',$val0+'px');
      $val1   =   $('#pop-up').css('top');
      $val1   =   $val1.split("px");
      $val1   =   $val1[0];
      $val2   =   $(document).height();
      $val3   =   $('#pop-up').css('height');
      $val3   =   $val3.split("px");
      $val3   =   $val3[0];
      if ($val1>=($val2-$val3-20)) {
         clearInterval($time2);
         $time3   =   setTimeout(close_pp,3000);
      };
   };
   
   function close_pp(){
      $('#pop-up').fadeOut("slow");
      $pop_banner   =   setTimeout(open_banner,$demora*1000);
   };
   
   $time1   =   setInterval(mover1,$acel);
};
   
   $pop_banner   =   setTimeout(open_banner,1000);
});
</script>


La ventaja de este metodo es que los bloqueadores de pop-up no te afectaran
La desventaja es que existe un pequeño porcentaje de los usuarios que tiene desactivado el javascript

:cool: Creo que hare un tuto con esta :lol: :P

Por NeoCesar

Claber

1415 de clabLevel

14 tutoriales

Genero:Masculino  

Algun lugar dentro de la Matrix (Lima - Perú)

msie8
Citar            
MensajeEscrito el 20 Dic 2009 03:43 am
Ante todo pedirles perdón por el tiempo que hace que no visitaba su página, pero es que he estado fuera mucho tiempo y ya estoy aca de vuelta en mi ciudad. Comentarle que su código no me funciona, yo lo he puesto así:
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" >
function aleatorio(inferior,superior){
numPosibilidades = superior - inferior
aleat = Math.random() * numPosibilidades
aleat = Math.round(aleat)
return parseInt(inferior) + aleat
};
$(document).ready(function(){
function open_banner() {
$banners = new Array("academia_julia","casa_aleste_1","confiterias_blanco_hermanos","fonta_esgueva","javier_mateo","jeydinicolas","ruben_arranz"); //Matriz que contiene el nombre de las imagenes de cada banner sin su extension
$nombres = new Array("ACADEMIA JULIA","CASA ALESTE","CONFITERÍAS BLANCO HERMANOS","FONTA ESGUEVA","JAVIER MATEO","JEYDINICOLAS","RUBÉN ARRANZ"); //Matriz con los nombres alternativos para cada banner campo "alt" en caso no cargue la imagen
$urls = new Array("academia_julia.html","casa_aleste.html","confiterias_blanco_hermanos.html","fonta_esgueva.html","javier_mateo.html","jeydinicolas.html","ruben_arranz.html"); //Matriz con las URL's a las que se vinculan cada banner en caso de no haber URL colocar "#"
$tamanyo = $banners.length-1; //Obtiene la longitud de la Matriz banners y le resta 1
$aleat = aleatorio(0,$tamanyo); //Obtiene un numero aleatorio entre 0 y el $tamanyo el cual representa al indice de matriz que se usara para
//mostrar el banner
$exist = $('#pop-up').length; //Cuenta cuantos elementos con id=popo-up existen
$alto = 225; //alto del banner
$ancho = 450; //ancho del banner
$mover = 2; //a mayor valor el banner se desplazara más pixeles y por tanto más rápido
$acel = 25; //a mayor valor el banner se movera más rápido
$desvanece = 3000; //Tiempo en milisegundo que demora el banner en empezar a desaparecer una vez que llega a la posicion final
$demora = 30; //Tiempo en segundos que demora en aparecer el siguiente banner despues de desaparecer el anterior
if ($exist==0) { //Comprueba la existencia del pop-up, de existir solo cambia su contenido
$('body').append('<div id="pop-up" style="position:fixed; top:10px; left:10px; width:'+$ancho+'px; height:'+$alto+'px; z-index:99999; background-color:#333; overflow:hidden;"><div id="close_pop" style="text-align:center; font-weight:bold; position:absolute; top:1px; left:'+($ancho-15)+'px; z-index:999999; border:1px solid #FFF; color:#FFF; font-size:9px; background-color:#000;">&nbsp;X&nbsp;</div><img src="'+$banners[$aleat]+'.jpg" alt="'+$nombres[$aleat]+'" style="width:'+$ancho+'px; height:'+$alto+'px; border:none;" /></div>');
} else {
$('#pop-up').html('<div id="close_pop" style="text-align:center; font-weight:bold; position:absolute; top:1px; left:'+($ancho-15)+'px; z-index:999999; border:1px solid #FFF; color:#FFF; font-size:9px; background-color:#000;">&nbsp;X&nbsp;</div><img src="'+$banners[$aleat]+'.jpg" alt="'+$nombres[$aleat]+'" style="width:'+$ancho+'px; height:'+$alto+'px; border:none;" />').css({'top':'10px','left':'10px'}).show();
};
$('#close_pop').mouseover(function(){$(this).css('cursor','pointer');}).click(function(){$('#pop-up').fadeOut('slow');});
$('#pop-up > img').mouseover(function(){$(this).css('cursor','pointer');}).click(function(){window.open($urls[$aleat],'sponsor');clearInterval($time1);$('#pop-up').hide();});

function mover1(){
$val0 = $('#pop-up').css('left');
$val0 = $val0.split("px");
$val0 = eval($val0[0])+$mover;
$('#pop-up').css('left',$val0+'px');
$val1 = $('#pop-up').css('left');
$val1 = $val1.split("px");
$val1 = $val1[0];
$val2 = $(document).width();
$val3 = $('#pop-up').css('width');
$val3 = $val3.split("px");
$val3 = $val3[0];
if ($val1>=($val2-$val3-20)) {
clearInterval($time1);
$time2 = setInterval(mover2,$acel);
};
};

function mover2(){
$val0 = $('#pop-up').css('top');
$val0 = $val0.split("px");
$val0 = eval($val0[0])+$mover;
$('#pop-up').css('top',$val0+'px');
$val1 = $('#pop-up').css('top');
$val1 = $val1.split("px");
$val1 = $val1[0];
$val2 = $(document).height();
$val3 = $('#pop-up').css('height');
$val3 = $val3.split("px");
$val3 = $val3[0];
if ($val1>=($val2-$val3-20)) {
clearInterval($time2);
$time3 = setTimeout(close_pp,3000);
};
};

function close_pp(){
$('#pop-up').fadeOut("slow");
$pop_banner = setTimeout(open_banner,$demora*1000);
};

$time1 = setInterval(mover1,$acel);
};

$pop_banner = setTimeout(open_banner,1000);
});
</script>
creo no haberme equivocado, si así lo fuera le rogaría me indicara donde esta el error, y no se si se puede hacer pero si me lo enviara por email se lo agradecería, pues suelo visitarlo más a menudo. Mi dirección es:
martgall4@hotmail.com.
Gracias.

Por martgall4

3 de clabLevel



Genero:Masculino  

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.