FAQs JavaScript

Kaopectate · #51 (**permalink**) 08/12/2002, 21:14

P: ¿Como puedo colocar en mi página una frase distinta cada día de la semana?

R: [ver ejemplo]

Código PHP:

  <html> 
 <head> 
  <script language="JavaScript"> 
   function frase(){ 
    var aFrases = new Array("Texto del Domingo",  
                            "Texto del Lunes",  
                            "Texto del Martes",  
                            "Texto del Miércoles",  
                            "Texto del Jueves",  
                            "Texto del Viernes",  
                            "Texto del Sábado"); 
    var fecha = new Date(); 
    var indice = fecha.getDay(); 
    return aFrases[indice]; 
   } 
  </script> 
 </head> 
 <body> 
  <form name="frm"> 
   <h1> 
    <script language="JavaScript"> 
     document.write(frase()); 
    </script> 
   </h1> 
  </form> 
 </body> 
</html>

Ruchu · #52 (**permalink**) 09/12/2002, 08:47

un efecto chachi para texto y no muy complicado, no lo he hecho yo, lo copie de no se donde.

Código PHP:

  <script> 
var TimerID; 
var updown = true; 
var str = 1; 
function start() 
{ 
if (document.all) 
TimerID = window.setInterval( "wave()", 100 ); 
} 
function wave() 
{ 
if ( str > 10 || str < 1 ) 
updown = !updown; 
if ( updown ) 
str++; 
else 
str--; 
wft.filters( "wave" ).phase = str * 20; 
wft.filters( "wave" ).strength = str; 
} 
window.onload=start 
</script> 
 
<div id = "wft" style = "font-family:Arial;font-size:10pt;width:60px; filter:wave(add=0, freq=7, light=0, phase=0, strength=5)" class = "big"><b>Ruchu</b></div>

KarlanKas · #53 (**permalink**) 09/12/2002, 15:12

P: ¿Cómo puedo hacer para que cada vez que se abra una página muestre un banner aleatorio, ya sea un archivo swf o un archivo gif?
R: Este código sirve también para cualquier archivo de imagen.

Código PHP:

  <html> 
<head> 
    <title>Selección de Banners Aleatorios</title> 
</head> 
 
<body> 
<SCRIPT LANGUAGE="JavaScript">  
// Realizado por: Fabian Muller modificado por KarlanKas para forosdelweb.com  
// WebExperto.com - Ayuda al webmaster en español  
// Comienzo  
 
width="468"; //Anchura del banner 
height="60"; //Altura del banner 
 
banners= new Array(); 
banners[0]="banner1.gif"; 
banners[1]="banner2.gif"; 
banners[2]="banner3.swf"; 
banners[3]="banner4.gif"; 
banners[4]="banner5.swf"; 
 
totalbanners = banners.length; 
var ahora = new Date() 
var segundos = ahora.getSeconds() 
var ad = segundos % totalbanners; 
seleccionado=banners[ad]; 
localizador=seleccionado.lastIndexOf('.'); 
localizador2=localizador+4 
extension=seleccionado.substring(localizador+1,localizador2);  
archivo=seleccionado.substring(0,localizador); 
 
document.write("<center>"); 
if (extension=="swf"){ 
flash=seleccionado; 
document.write('<OBJECT CLASSID=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=' + width + ' height=' + height + ' CODEBASE=\"http://active.macromedia.com/flash4/cabs/swflash.cab#version=4,0,0,0\">'); 
document.write('<PARAM NAME=\"MOVIE\" VALUE=\"' + flash + '\">'); 
document.write('<PARAM NAME=\"PLAY\" VALUE=\"true\">'); 
document.write('<PARAM NAME=\"LOOP\" VALUE=\"true\">'); 
document.write('<PARAM NAME=\"QUALITY\" VALUE=\"high\">'); 
document.write('<EMBED SRC=' + flash + ' width=' + width + ' height=' + height + ' PLAY=\"true\" LOOP=\"true\" QUALITY=\"high\" PLUGINSPAGE=\"http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash\">'); 
document.write('</EMBED>'); 
document.write('</OBJECT>');} 
else {document.write('<img src='+seleccionado+' width='+width+' height='+height+'>'); 
document.write('</center>');} 
// Fin 
 
</SCRIPT> 
 
<!-- RESTO DE PÁGINA--> 
</body> 
</html>

Espero que sirva!

CORE · #54 (**permalink**) 09/12/2002, 20:19

54 Detectar Plugins

P ¿Como detecto flash player?

R

Código PHP:

  <script language="JavaScript"> 
<!-- 
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { 
  var ok=false; document.MM_returnValue = false; 
  with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { 
    ok=(plugins && plugins[plgIn]); 
  } else if (appVersion.indexOf('3.1')==-1) { 
    if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; 
    else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; 
    else ok=autoGo; } 
  if (!ok) theURL=altURL; if (theURL) window.location=theURL; 
} 
//--> 
</script> 
</head> 
 
<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_checkPlugin('Shockwave Flash','index.html','http://www.macromedia.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash&amp;Lang=LatinAmerica&amp;P5_Language=Spanish',true);return document.MM_returnValue">

P¿Como detecto shockwave player?
R

Código PHP:

  <script language="JavaScript"> 
<!-- 
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 
  var ok=false; document.MM_returnValue = false; 
  with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { 
    ok=(plugins && plugins[plgIn]); 
  } else if (appVersion.indexOf('3.1')==-1) { //not Netscape or Win3.1 
    if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; 
    else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; 
    else ok=autoGo; } 
  if (!ok) theURL=altURL; if (theURL) window.location=theURL; 
} 
//--> 
</script> 
</head> 
 
<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_checkPlugin('Shockwave for Director','index.html','http://www.macromedia.com/shockwave/download/download.cgi?Lang=LatinAmerica&amp;P5_Language=Spanish',true);return document.MM_returnValue">

P ¿Como detecto live audio?

R

Código PHP:

  <script language="JavaScript"> 
<!-- 
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 
  var ok=false; document.MM_returnValue = false; 
  with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { 
    ok=(plugins && plugins[plgIn]); 
  } else if (appVersion.indexOf('3.1')==-1) { //not Netscape or Win3.1 
    if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; 
    else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; 
    else ok=autoGo; } 
  if (!ok) theURL=altURL; if (theURL) window.location=theURL; 
} 
//--> 
</script> 
</head> 
 
<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_checkPlugin('LiveAudio','index.html','http://www.live-audio.com/',true);return document.MM_returnValue">

P¿Como detecto Netscape Media Player?
R

Código PHP:

  <script language="JavaScript"> 
<!-- 
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 
  var ok=false; document.MM_returnValue = false; 
  with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { 
    ok=(plugins && plugins[plgIn]); 
  } else if (appVersion.indexOf('3.1')==-1) { //not Netscape or Win3.1 
    if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; 
    else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; 
    else ok=autoGo; } 
  if (!ok) theURL=altURL; if (theURL) window.location=theURL; 
} 
//--> 
</script> 
</head> 
 
<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_checkPlugin('Netscape Media Player','index.html','http://rc.lrs.lt:8080/n/media/nmplaydn.html',true);return document.MM_returnValue">

P¿Como detecto quick time?
R

Código PHP:

  <script language="JavaScript"> 
<!-- 
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 
  var ok=false; document.MM_returnValue = false; 
  with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { 
    ok=(plugins && plugins[plgIn]); 
  } else if (appVersion.indexOf('3.1')==-1) { //not Netscape or Win3.1 
    if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; 
    else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; 
    else ok=autoGo; } 
  if (!ok) theURL=altURL; if (theURL) window.location=theURL; 
} 
//--> 
</script> 
</head> 
 
<body bgcolor="#FFFFFF" text="#000000" onLoad="MM_checkPlugin('QuickTime Plug-In','index.html','http://www.apple.com/quicktime/download/',true);return document.MM_returnValue">

tunait · #55 (**permalink**) 10/12/2002, 08:29

R. Ver ejemplo

Código PHP:

  <script language="javascript"> 
 
//script por Tunait 
var ventana 
var cont=0 
var titulopordefecto = "Perico de los palotes" //texto por defecto a mostrar en la barra de título en caso de omitir el argumento titulo 
 
function afoto(cual,titulo) 
{ 
if(cont==1){ventana.close();ventana=null} 
if(titulo==null){titulo=titulopordefecto} 
ventana=window.open('','ventana','resizable=yes,scrollbars=no') 
ventana.document.write('<html><head><title>' + titulo + '</title></head><body style="overflow:hidden" marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" scroll="no" onUnload="opener.cont=0"><img src="' + cual + '" onLoad="opener.redimensionar(this.width, this.height)">') 
ventana.document.close() 
cont++ 
} 
function redimensionar(ancho,alto) 
{ 
ventana.resizeTo(ancho+12,alto+28) 
ventana.moveTo((screen.width-ancho)/2,(screen.height-alto)/2) //centra la ventana. Eliminar si no se quiere centrar el popup 
} 
</script>

Y luego a cada enlace a cada imagen....

desde texto: <a href="#" onClick="afoto('nombredelaimagen.jpg','Mi titulo');return false">Imagen 1 </a>

desde una imagen: <a href="#" onClick="afoto('nombredelaimagen.jpg','Mi titulo');return false"><img src="imagen.jpg"></a>

Nota: Se puede omitir el segundo argumento (titulo) al llamar a la función. En ese caso la ventana tendrá el título por defecto guardada en la variable titulopordefecto

tunait · #56 (**permalink**) 10/12/2002, 08:49

R. Es una variante que incluye la posibilidad de pasar a la imagen siguiente o a la anterior desde el mismo pop-up

Código PHP:

  <script language="javascript"> 
 
//Ventana ajustada a foto por tunait 
 
var ventana 
//metemos en un array el listado de las imágenes que queramos utilizar en el orden que nos interese 
 
afotos=new Array() 
afotos[0]="tibidabo.jpg" 
afotos[1]="gato.jpg" 
afotos[2]="paloma.jpg" 
afotos[3]="perico.jpg" 
 
function afoto(cual) 
{ 
if(ventana){ventana.close()} 
buscar(cual) 
ventana=window. open('','ventana','resize=yes,scrollbars=no,resizable=yes') 
ventana.document.write('<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"><img id="foto" alt="mi foto" src="' + cual + '" onLoad="opener.redimensionar(this.width, this.height)">') 
ventana.document.write('<br><div align="center"><a href="#" onClick="if(opener.cont==0){opener.cont=opener.afotos.length-1}else{opener.cont--};document.getElementById(\'foto\').src =opener.afotos[opener.cont];return false">anterior</a>') 
ventana.document.write('  |  <a href="#" onClick="if(opener.cont==opener.afotos.length-1){opener.cont=0}else{opener.cont++};document.getElementById(\'foto\').src =opener.afotos[opener.cont];return false">siguiente</a>') 
} 
 
var cont 
function redimensionar(ancho, alto) 
{ 
ventana.resizeTo(ancho,alto+50) 
} 
function buscar(que) 
{ 
for(c=0;c<afotos.length;c++) 
{ 
   if(afotos[c]==que) 
   { 
   cont= c; 
   return cont 
   break 
  } 
} 
 
} 
</script>

... y luego llamamos a cada imagen a través de la función pasándole como argumento el nombre de la imagen:

<body bgcolor="#FFFFFF" text="#000000">
<div align="center"><b onClick="afoto('tibidabo.jpg')">Tibidabo</b>   
<b onClick="afoto('gato.jpg')">Gato</b>   <b onClick="afoto('paloma.jpg')">Paloma</b>
  <b onClick="afoto('perico.jpg')">Perico</b> </div>
</body>

Carlitos · #57 (**permalink**) 10/12/2002, 12:02

57.- Mostrar/ocultar capas [Ejemplo]

P.- ¿Cómo puedo mostrar/ocultar capas pulsando sobre un enlace?

R.- Código de ejemplo. (Funciona en todos los navegadores, creo)

Código:

<html>
<head>
<script LANGUAGE="javascript">
var capa
function cambio(idCapa){
 if (document.layers) capa = eval("document." + idCapa);
 if (document.all) capa = eval(idCapa + ".style");
 if (document.getElementById) capa = eval('document.getElementById("' + idCapa + '").style');

 if ((capa.visibility == "hidden") || (capa.visibility == "hide")){
  capa.visibility = (document.layers) ? "show" : "visible" ;
 }else{
  capa.visibility = (document.layers) ? "hide" : "hidden" ;
 }
}
//-->
</script>
</head>
<body>
<div id="capa1" style='position:relative;'>
Esta es la capa 1
</div>
<div id="capa2" style='position:relative;'>
Esta es la capa 2
</div>
<a href="#" onclick="cambio('capa1')">Muestra/oculta la capa 1</a>
<br>
<a href="#" onclick="cambio('capa2')">Muestra/oculta la capa 2</a>
</body>

JavierB · #58 (**permalink**) 10/12/2002, 12:38

58.- Navegar con un menú desplegable (select)

P.- ¿Cómo puedo cambiar de página segun la opción elegida en un <select>?

R.- Con un código parecido a este:

Código PHP:

  <select name="select" onChange="location.href=this.value"> 
  <option value="paginauno.html">Pagina 1</option> 
  <option value="paginados.html">Pagina 1</option> 
  <option value="paginatres.html">Pagina 1</option> 
</select>

Kaopectate · #59 (**permalink**) 11/12/2002, 08:19

P: ¿Como puedo redireccionar lo escrito en un elemento HTML hacia otro elemento?

R: [ver ejemplo]

Código PHP:

  <html> 
 <head> 
  <script language="JavaScript"> 
   function redirecciona(){ 
    if (oTrap.checked){ 
     oOutput.innerText += "[trap = " + event.keyCode + "]"; 
     event.returnValue = false; 
    } else oOutput.innerText += String.fromCharCode(event.keyCode); 
   } 
  </script> 
 </head> 
 <body> 
  <table border="0"> 
   <tr> 
    <td> 
     Texto:<input id="oExample" type="text" onkeydown="redirecciona()"> 
    </td> 
    <td> 
     <input type="checkbox" id="oTrap"> Modo debug 
    </td> 
   </tr> 
   <tr> 
    <td colspan="2"> 
     <textarea id="oOutput" rows="10" cols="50"></textarea> 
    </td> 
   </tr> 
  </table> 
 </body> 
</html>

Kaopectate · #60 (**permalink**) 11/12/2002, 11:52

P: ¿Como puedo filtrar los elementos que conforman un select de acuerdo a lo tipeado en un área de texto?

R: [ver ejemplo]

Código PHP:

  <html> 
 <head> 
  <script language="JavaScript"> 
 
   var i; 
 
   function addOpt(oCntrl, sTxt, sVal, sCnd){ 
    if (sTxt.substr(0, sCnd.length).toUpperCase() == sCnd.toUpperCase()){ 
     var selOpcion=new Option(sTxt, sVal); 
     eval(oCntrl.options[i++]=selOpcion); 
    } 
   } 
 
   function cambia(oCntrl){ 
    var txtVal = document.frm.txt.value; 
    while(oCntrl.length > 0) oCntrl.options[0]=null; 
    i = 0; 
    oCntrl.clear; 
    addOpt(oCntrl,  "Ciudad de México", "0", txtVal); 
    addOpt(oCntrl,  "Ciudad de Panamá", "0", txtVal); 
    addOpt(oCntrl,  "Ciudad de Guatemala", "0", txtVal); 
    addOpt(oCntrl,  "Caracas", "0", txtVal); 
    addOpt(oCntrl,  "Cancún", "0", txtVal); 
    addOpt(oCntrl,  "Maracay", "0", txtVal); 
    addOpt(oCntrl,  "Maracaibo", "0", txtVal); 
    addOpt(oCntrl,  "Zaragoza", "0", txtVal); 
   } 
  </script> 
 </head> 
 <body onload="cambia(document.frm.ciudad)"> 
  <form name="frm"> 
   <table border="0"> 
    <tr> 
     <td> 
      Ciudad: 
     </td> 
     <td> 
      <input type="text" name="txt" onkeyup="cambia(document.frm.ciudad)"> 
     </td> 
     <td> 
      <select name="ciudad"> 
      </select> 
     </td> 
    </tr> 
   </table> 
  </form> 
 </body> 
</html>