Foros del Web
Página 5 de 6 1234 5 6
Mostrar 50 mensajes desde este tema en una página

Foros del Web (http://www.forosdelweb.com/)
-   Javascript (http://www.forosdelweb.com/f13/)
-   -   FAQs JavaScript (http://www.forosdelweb.com/f13/faqs-javascript-105325/)

jordia 29/11/2004 14:27
Reloj PHP/Javascript
 
Aqui os presento un reloj digital en javascript el cual imprime la fecha y hora del servidor y lo pone en una variable en javascript, y lo actualiza, aunque en realidad es una pequeña modificacion del codigo del reloj que se encuentra en esta FAQ.

Código HTML:
<html>
<head>
<title>el reloJ</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
        var Hoy = new Date("<?php echo date("d M Y G:i:s");?>");
function Reloj(){
        Hora = Hoy.getHours()
        Minutos = Hoy.getMinutes()
        Segundos = Hoy.getSeconds()
        if (Hora<=9) Hora = "0" + Hora
        if (Minutos<=9) Minutos = "0" + Minutos
        if (Segundos<=9) Segundos = "0" + Segundos
        var Dia = new Array("Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo");
        var Mes = new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");
        var Anio = Hoy.getFullYear();
        var Fecha = Dia[Hoy.getDay()] + ", " + Hoy.getDate() + " de " + Mes[Hoy.getMonth()] + " de " + Anio + ", a las ";
        var Inicio, Script, Final, Total
        Inicio = "<font size=3 color=black>"
        Script = Fecha + Hora + ":" + Minutos + ":" + Segundos
        Final = "</font>"
        Total = Inicio + Script + Final
        document.getElementById('Fecha_Reloj').innerHTML = Total
        Hoy.setSeconds(Hoy.getSeconds() +1)
        setTimeout("Reloj()",1000)
}
</script>
</head>
<body onload="Reloj()">
<div id="Fecha_Reloj"></div>
</body>
</html>

y ojala les sirva

caricatos 18/12/2004 04:36
gradientes
 
P: ¿Como obtengo los colores intermedios de 2 dados en n pasos?

R: ¿Aplicando la función transitar que se describe abajo, con los 2 colores y n como parámetros?

Código:
function decahex(n) {
        return hexa.charAt(n / 16) + hexa.charAt(n % 16);
}

function colorHexa(c) {
        return "#" + decahex(c[0]) + decahex(c[1]) + decahex(c[2]);
}

function transitar(ini, fin, pasos) {
        var dato = desglose(ini);
        var rIni = dato[0];
        var gIni = dato[1];
        var bIni = dato[2];

        var intermedios = new Array(pasos);
        intermedios[0] = dato;

        var dato = desglose(fin);

        intermedios[pasos - 1] = dato;

        var rFin = dato[0];
        var gFin = dato[1];
        var bFin = dato[2];

        var rMed = (rFin - rIni) / (pasos - 1);
        var gMed = (gFin - gIni) / (pasos - 1);
        var bMed = (bFin - bIni) / (pasos - 1);

        for (var i = 1; i < pasos - 1; i ++)        {
                var rgb = new Array(3);
                rgb[0] = parseInt(rIni + (rMed * i));
                rgb[1] = parseInt(gIni + (gMed * i));
                rgb[2] = parseInt(bIni + (bMed * i));
                intermedios[i] = rgb;
        }
        for (i = 0; i < intermedios.length; i ++)
                intermedios[i] = colorHexa(intermedios[i]);

        return intermedios;
}

function desglose(color) {
        if (color.length != 6)
                return "poblema";
        else        {
                devolver = new Array(3);
                devolver[0] = hexadec(color.substr(0, 2));
                devolver[1] = hexadec(color.substr(2, 2));
                devolver[2] = hexadec(color.substr(4, 2));
        }
        return devolver;
}
var hexa = "0123456789abcdef";

function hexadec(x) {
        x = x.toLowerCase();
        return parseInt(hexa.indexOf(x.charAt(0))) * 16 + parseInt(hexa.indexOf(x.charAt(1)))
}
Notas:
Los colores deben escribirse en hexadecimal (String) y sin el carácter #.
La función transitar devuelve un array de colores hexadecimales aplicables directamente a los atributos color de los tags que lo soporten (p.e. font) y a los estilos color, background-color y border-color.

Ejemplo de utilización:
var colores = transitar("000000", "ffffff", 3);
Devuelve el siguiente array: ["#000000", "#7f7f7f", "#ffffff"];

Aplicaciones: crear fondos degradados como el ejemplo que hay en estas mismas FAQs

:adios:

epa2 13/01/2005 06:44

204.- Abrir ventana que quede por detras.
Pregunta: ¿Como puedo abrir un popup (no hace falta que sea popup) y que este se quede por detras de la ventana principal?
Respuesta: Si insertas este código en el head de la página que abres, ésta quedará en segundo plano.


Código PHP:
<script languaje="javascript"> 
self.blur() 
</script> 
:adios:

epa2 13/01/2005 06:51

206.- Poner el foco en la ventana padre.
Pregunta: ¿Como puedo colocar el foco en la ventana padre.
Respuesta: Desde la ventana que has abierto, puedes pasar el foco a la ventana que abrió el popup. Para ello deberías colocar este script en la cabecera de la ventana abierta:


Código PHP:
<script> 
window.opener.focus() 
</script> 


NOTA: Poner el foco en la ventana padre desde la ventana padre

Se puede hacer lo mismo, pero ejecutando la sentencia en el código Javascript de la ventana padre. Para ello habría que escribir esta línea de código a continuación del window.open:

window.focus()

:adios:

JavierB 24/01/2005 11:25
207.- Añadir días a una fecha (versión 2)
 
P: ¿Como puedo sumar un número de días a una fecha dada?

R: Usando este código:

Código PHP:
<?xml version="1.1" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>
<head>
<title>Sumar días a una fecha</title>
<script type="text/javascript">
<!--
function aumenta(frm) {
  num=frm.incremento.value;
  f=frm.fecInicio.value;
  // pasaremos la fecha a formato mm/dd/yyyy
  f=f.split('/');
  f=f[1]+'/'+f[0]+'/'+f[2];
  //
  hoy=new Date(f);
  hoy.setTime(hoy.getTime()+num*24*60*60*1000);
  mes=hoy.getMonth()+1;
  if(mes<9) mes='0'+mes;
  fecha=hoy.getDate()+'/'+mes+'/'+hoy.getFullYear();
  frm.total.value=fecha;  
}
-->
</script>
</head>
<body>
<form action="">
<p>Fecha de inicio (d/mm/aaaa): <input type="text" name="fecInicio" /><br />
Días a sumar: <input type="text" name="incremento" /><br />
Fecha final: <input type="text" name="total" readonly="readonly" /><br />
<input type="button" value="Calcular" onclick="aumenta(this.form)" /></p>
</form>
</body>
</html>

caricatos 06/02/2005 01:32
208. Enlace desde popup a ventana principal
 
P: Enlace desde popup a ventana principal:

R: Consiste en asignar un nombre a la ventana con window.name:

window.name = "principal";
Y luego poner en el popup el target="principal" en el enlace.
<a href="destino.html" target="principal" > Enlace a la página abridora </a>

También valdría para destinos de formularios.
<form action="destino.html" target="principal" >
....
</form>

Hay más formas de hacerlo... con javascript poner:
opener.location.href = "destino.html";

Otra posibilidad es poner en el mismo popup la asignación del nombre de la ventana:
opener.name = "principal;"


Si tienen dudas sobre esta pregunta, pueden plantearlas en este mensaje: http://www.forosdelweb.com/f13/propuesta-faq-266234/

:adios:

trasgukabi 27/02/2005 18:40
209. Cómo puedo validar el ISBN de un libro
 
P: Cómo puedo validar el ISBN de un libro?

R:Llegando a forosdelweb a partir de ahora, porque en google no he encontrado nada y ha salido esto de mi cabecita:
Código:
<script language="javascript">
function comprueba()
{
        if (document.form2.isbn.value!="x-xxxx-xxxx-x")
        {
                var salida, plantilla;                 
                var texto = document.form2.isbn.value;
                var estructura=true;
                plantilla = new RegExp("^[0-9]{1,5}-[0-9]{1,7}-[0-9]{1,6}-[0-9xX]$");
                salida = texto.match(plantilla);
                if (salida==null)
                {
                        estructura=false;
                }
                if (texto.length!=13)
                {
                        estructura=false;
                }
                if (!estructura)
                {
                        alert("La estructura del ISBN introducido no coincide con el estándar ISBN\n\nEjemplo: 0-8436-1072-7\n\n El estándar indica esta estructura:\nde 1 a 5 números\nguión\nde 1 a 7 números\nguión\nde 1 a 6 números\nguión\ndígito de control. de 0 a 9 o \"X\" si el dígito es 10\nLa longitud total debe ser de 10 dígitos, más los tres guiones.")
                }
                else
                {
                        tt2 = texto.split("-");
                        grupo1=new String(tt2[0]);
                        grupo2=new String(tt2[1]);
                        grupo3=new String(tt2[2]);
                        grupo4=new String(tt2[3]);
                        total= new Number(0);
                        ponderacion=new Number(10);
                        for (j= 0; j <grupo1.length; j++)
                        {       
                                total+=(parseInt(grupo1.charAt(j))*ponderacion);
                                --ponderacion;
                        }
                        for (j= 0; j <grupo2.length; j++)
                        {       
                                total+=(parseInt(grupo2.charAt(j))*ponderacion);
                                --ponderacion;
                        }       
                        for (j= 0; j <grupo3.length; j++)
                        {       
                                total+=(parseInt(grupo3.charAt(j))*ponderacion);
                                --ponderacion;
                        }
                        if(grupo4=="X" || grupo4=="x")
                        {
                                grupo4="10";               
                        }
                        resto=(total+parseInt(grupo4))%11;
                        if (resto==0)
                        {
                                //document.form2.submit();
                                alert("ISBN Correcto");
                        }
                        else
                        {
                                alert("El dígito de control (último numero de la serie) no es correcto. ISBN inválido.");
                        }
                }
        }
}</script>


                <form name="form2">
                <input type="text" value="x-xxxx-xxxx-x"  maxlength="13"><input type="button" onClick="javascript:comprueba();" value="buscar">
                </form>
Para el que se quiera empapar de cómo se curra con los ISBN y los EAN, que se baje este pdf de mi página. un buen documento, si señor:
ISBN-EAN.rar(366K)

phpec 07/03/2005 15:17
210.-Mensaje Barra de Titulo
 
P: ¿Como pongo efecto de maquina de maquina de escribir en la barra de titulo?
R::

<SCRIPT LANGUAGE='JavaScript'>
texto = "Mensaje de título";
l = texto.length;
vel = 150;
conta = 0;
function cambiaTitulo() {
if(conta <= l){
conta ++;
t = texto.substr(0, conta)
document.title = t;
}else{
conta = 0;
}
setTimeout("cambiaTitulo();",vel);
}
cambiaTitulo();

</SCRIPT>

programeitor 05/04/2005 14:01
211. Como definir estilos por tipo
 
P:Como definir estilos por tipo.

R:Mediante una funcion llamada en el onload.

<html>
<head>
<script>
function EstiloPorTipo(marca,tipo,estilo){// programeitor 2005, [email protected]
var e=estilo.split(',');
var m=document.getElementsByTagName(marca);
for(var n=0;n<m.length;n++){
if(m[n].type==tipo){
for(var i=0;i<e.length;i+=2){
m[n].style[e[i]]=e[i+1];
}
}
}
}
</script>
</head>
<body onload=EstiloPorTipo('input','text','background,red,width,200px')>
<input type="text" value="asd">
<input type="button" value="asd">

</body>
</html>

programeitor 05/04/2005 15:10
212. Como crear una base de datos HTML
 
PREGUNTA:Como crear una base de datos HTML.(solo lectura)


RESPUESTA:

MODIFICACION Y MEJORA

Despues de darle muchas vueltas y quitar codigo innesesario para una mejor comprension he conseguido simplificar la cuestion, añadiendo un pequeño script a la pagina principal que hace que las paginas de datos tengan exactamente el mismo y mas pequeño script(sin nesesidad de cambiar nombres). ,he quitado etiquetas innesesarias en las paginas de datos ,resumiendose todo a un div y un script. He borrado el codigo anterior por darme error de esceso de caracteres al enviar el post, ademas de ya no ser nesesario. Otra cosa de interes es que la pagina se carga mucho antes ,cuestion esta a la que no encuentro explicacion.
Esta utilidad vale igualmente para recoger valores de variables, campos de texto ,etc.... solo asignandoles el valor de 'datos'.

SCRIPT DE LA PAGINA PRINCIPAL:
la funcion 'carga' carga en el iframe las paginas de datos definidas en el arreglo 'fr'.
la funcion 'lee' es llamada desde cada pagina de datos ,las cuales mandan el contenido de sus 'divs' a el 'div' correspondiente de la pagina principal.

<script>
fr=new Array('div1','div2',........,'divn')
cf=0
ruta=''// ruta a los archivos de datos
function carga(){
if(cf<fr.length){window.frames[0].location.href=ruta+fr[cf]+'.html';cf++;}
}
function lee(datos){document.getElementById(fr[cf-1]).innerHTML=datos;}
</script>

BODY DE LA PAGINA PRINCIPAL:
La colocacion de los 'divs' es meramente explicativa, tanto el diseño como los estilos no corrresponden a esta faq. Lo que si es extrictamente nesesario es la colocacion del iframe que nos servira para cargar las paginas de datos.

<body onload="carga()">
<iframe style="visibility:hidden;"></iframe>
<div id="div1"></div>
<div id="div2"></div>
.........
<div id="divn"></div>
</body>
</html>

ESQUEMA DE UNA PAGINA DE DATOS:
Este se resume en el 'div datos' y el script de carga. Deben guardarse con el mismo nombre que los 'divs' a los que van destinados. Para este ejemplo estan guardados con la extension '*.html'.
El contenido del div puede ser tanto texto simple como etiquetas html.
Tambien es posible la lectura de varios 'divs' de una pagina de datos, simplemente añadiendo otra vez lo mismo: div-script-div-script....., para ello hay que dar nombres diferentes a cada uno de los divs y modificar igualmente el parametro de las funciones, Todo ello podria resumirse con un script final, despues de los 'divs': div-div-div......script, que haga un bucle al estilo de la funcion 'carga' de la pagina principal. Igualmente ,y siguiendo esta dinamica, podria ser un formulario abierto en un popup, y en el submit, cambiar 'parent' por 'opener', pero esto habria que comprobarlo.

<div id="datos">
CONTENIDO
</div>
<script>parent.lee(document.getElementById("datos").innerHTML);parent.carga();</script>

Mencion especial a caricatos, por su colaboracion en la resolucion de un escollo de esta utilidad.

Podeis ver una pagina cargada de esta forma en http://es.geocities.com/opinionxreflexion/tarteso/
compuesta de 6 divs cargados desde 6 archivos diferentes.


CREDITOS: programeitor 2005. [email protected]

T4X 26/04/2005 14:48
213. Cómo hago la letra capital en un text input
 
Pregunta: Cómo hago la letra capital en un text input?
Respuesta:

En el text-input colocas el método onBlur colocas lo siguiente:
Código PHP:
onBlur="this.style.textTransform='capitalize'" 
Y si lo deseas, el texto en minusculas junto con la letra capital, entonces quedaría así:
Código PHP:
onBlur="this.value = this.value.toLowerCase(); this.style.textTransform='capitalize'" 

Saruman 03/05/2005 10:38
214. Format Currency (Monedas)
 
Pregunta: ¿Cómo transformo un valor en monedas?

utilización:

cantidad = 5
precio_unitario = 10.98

total = cantidad * precio_unitario
//el resultado de total de haber multiplicado esos dos valores en javascript nos traerá como resultado: 54.900000000000006
//para redondearlo y transformarlo a moneda utilizaremos la siguiente función:


total = formatCurrency(total);
document.write(total);

resultado: 54.90


//Nota: no le pases el parseInt() después de multiplicar el valor ok?


Función:
Código:
function formatCurrency(num) {
        num = num.toString().replace(/\$|\,/g,'');
        if(isNaN(num)) num = "0";
        sign = (num == (num = Math.abs(num)));
        num = Math.floor(num*100+0.50000000001);
        cents = num%100;
        num = Math.floor(num/100).toString();
        if(cents<10) cents = "0" + cents;
        for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
        num = num.substring(0,num.length-(4*i+3))+
        num.substring(num.length-(4*i+3));
                       
        return (((sign)?'':'-') + num + '.' + cents);
}
Saludos :arriba:

KarlanKas 09/05/2005 10:55
215. Selector de color
 
P.- Cómo hacer un selector de color?
R.-Hay varias opciones. Una de las mismas es este código que propongo:

Código PHP:
<html> 
<head> 

<script> 

//Script de KarlanKas para Foros Del Web 
//Muchas gracias a caricatos por advertirme de los fallitos ;-) 
//He aprovechado para mejorar un poco el script 

hexadecimal=['0' , '1' , '2' , '3' , '4' , '5' , '6' , '7' , '8' , '9' , 'A' , 'B' , 'C' , 'D' , 'E' , 'F']; 
r=0; 
g=0; 
b=0; 
colores=["r","g","b"]; 

function color(incremento,n){ 

    if(eval(colores[n])+incremento<256 && eval(colores[n])+incremento>-1){ 
        eval(colores[n]+"+="+incremento); 
    } 

    document.getElementById("campo").style.backgroundColor="rgb("+r+","+g+","+b+")"; 
    document.getElementById("campo").style.color="rgb("+(255-r)+","+(255-g)+","+(255-b)+")"; 
     
    document.getElementById("color").value="#"+convertir(r)+convertir(g)+convertir(b); 
    document.getElementById("color2").value="rgb("+r+","+g+","+b+")"; 

} 

function convertir(numero){ 
    numero=parseInt(numero) 
    enHexa=hexadecimal[parseInt(numero/16)]+""+hexadecimal[numero%16]; 
    return enHexa; 
} 
</script> 

<style> 
*{ 
    font:normal 10px/10px verdana; 
} 
#campo{ 
    height:400px; 
} 
div[id="campo"]{ 
    height:210px!important; 
} 
#campo{ 
    width:400px; 
    background-color:rgb(0,0,0); 
    font:bold 20px/20px verdana; 
    color:#fff; 
    text-align:center; 
    padding-top:190px; 
} 
</style> 
</head> 

<body> 

<div style="width:400px;"> 
    <div id="campo" >FOROS DEL WEB</div> 

    <table>
        <tr>
            <td>En Hexadecimal:</td>
            <td><input type="text" name="color" id="color" readonly></td>
        <tr>
            <td>En Decimal:</td>
            <td><input type="text" name="color2" id="color2" readonly><br></td>
        </tr>
    </table> 
    <div style="float:left;border:solid 1px black;padding:10px;width:110px;">Mantén apretado cada botón hasta llegar al valor deseado.</div> 
    <table style="text-align:center;"> 
        <tr> 
            <td><input type="button" onmouseup="clearInterval(pepe)"  value="-" onmousedown="pepe=setInterval('color(-5,0)',100)"></td>
            <td>Rojo</td> 
            <td><input type="button" onmouseup="clearInterval(pepe)"   value="+" onmousedown="pepe=setInterval('color(5,0)',100)"></td>
        </tr> 
        <tr> 
            <td><input type="button" onmouseup="clearInterval(pepe)"  value="-" onmousedown="pepe=setInterval('color(-5,1)',100)"></td>
            <td>Verde</td>
            <td><input type="button" onmouseup="clearInterval(pepe)"  value="+" onmousedown="pepe=setInterval('color(5,1)',100)"></td>
        </tr>
        <tr> 
            <td><input type="button" onmouseup="clearInterval(pepe)"  value="-" onmousedown="pepe=setInterval('color(-5,2)',100)"></td> 
            <td>Azul</td> 
            <td><input type="button" onmouseup="clearInterval(pepe)"  value="+" onmousedown="pepe=setInterval('color(5,2)',100)"></td> 
        </tr> 
    </table> 
</div> 

</body> 
</html> 

occiso 21/05/2005 05:02
216.-Añadir método Trim a la clase String
 
P: ¿Cómo puedo añadir un método a la clase String para que me borre los espacios en blanco?

R:

Muchos nos hemos preguntado alguna vez porque no viene intrínsecamente definido en la clase String un método Trim que nos elimine los espacios en blanco que pueda haber en una cadema.

Pero eso lo podemos solucionar nosotros mismos añadiendoselo (puedes meterlo en un archivo .js y servirte para cualquier página que lo necesites):


Código:
<HTML>
<HEAD>
<TITLE>Document </TITLE>
  <script language="javascript">
/* -----------------------------------------------------------------------------------
------- Trim(), LTrim(), RTrim() -----------------------------------------------------
-------
------- Metodos que eliminan los espacios en blanco de una cadena */

  String.prototype.Trim = function(){
      return this.replace(/\s+$|^\s+/g,"");
  }

  String.prototype.LTrim = function(){
      return this.replace(/^\s+/,"");
  }

  String.prototype.RTrim = function(){
        return this.replace(/\s+$/,"");
  }
 
/*-------------------------------------------------------------------------------------*/

  function ambos(str){
      str = str.Trim();
      alert (  '|' + str + '|');
  }

  function izq(str){
      str = str.LTrim();
      alert (  '|' + str + '|');
  }

  function dcha(str){
      str = str.RTrim();
      alert (  '|' + str + '|');
  }

  </script>
</HEAD>

<BODY>
<button onclick="ambos('  galleta  ')">ambos lados</button>
<button onclick="izq('  galleta  ')">izquierda</button>
<button onclick="dcha('  galleta  ')">derecha</button>
</BODY>
</HTML>

occiso 21/05/2005 05:30
217.- Clase validaciones para validar formularios
 
P: ¿Cómo puedo validar los formularios y que los datos que introducen son los correctos?

R: Muchas son las consultas sobre como validar este o aquel campo. Bien pues he desarrollado una pequeña clase en Javascript que creo cubre el 90% de validaciones que tengamos que realizar.

Para manejarla bien hay que saber algo de programación orientada a objetos (POO) pero si se le hecha un vistazo es bastante intuitiva y esta muy comentada. Como es un archivo bastante extenso meto un enlace a un archivo .rar con el archivo .js en cuestion y una pagina html de ejemplo de utilización y otro archivo .css con los estilos.

La clase sigue un código estándar y yo la he probado en Opera, IExplorer y Firefox y me ha funcionado perfectamente. Lo que no es estándar son los estilos css.

EDITADO (07/08/2005):

Como el enlace se había roto vuelvo a poner una direccion para que os podais bajar todos los archivos en uno comprimido. He hecho algunas mejoras respecto a la version anterior. Ahora voy por la version 1.1. Ahi la teneis:

Enlace

T4X 01/06/2005 17:15
218. Resaltado de celdas a través de checkbox
 
Pregunta: Cómo resaltar los checkboxes como lo hace hotmail?
Créditos: JavierB

Respuesta:
Usa este código, es simple pero te funcionará...

<html>
<head>
<script>
function marcar(obj) {
elem=obj.parentNode.parentNode;
elem.style.backgroundColor=(obj.checked) ? 'red' : 'white';
}

function marcarTodos(obj) {
elem=document.getElementsByName('algo');
for(i=0;i<elem.length;i++) {
elem[i].checked=obj.checked;
fila=elem[i].parentNode.parentNode;
fila.style.backgroundColor=(obj.checked) ? 'red' : 'white';
}
}
</script>
</head>

<body>
<table width="400px" border="1">
<tr>
<td>&nbsp;</td>
<td><input type="checkbox" name="todos" onclick="marcarTodos(this)"/></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>
<input type="checkbox" name="algo" onclick="marcar(this)"/>
</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>
<input type="checkbox" name="algo" onclick="marcar(this)"/>
</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>
<input type="checkbox" name="algo" onclick="marcar(this)"/>
</td>
</tr>
</table>
</body>
</html>

JavierB 08/06/2005 03:56
219 - Filtrar datos de una tabla según lo escrito en un cuadro de texto
 
P - ¿Como puedo hacer para que solo se vean las filas de una tabla (<table>) que coinciden con lo escrito en un cuadro de texto?

R - Con este código:
Código PHP:
<html>
<head>
<script>
function buscar(txt) {
  obj=document.getElementById('tabla');
  // Recorremos todas las filas de la tabla
  for (i=0;ele=obj.getElementsByTagName('tr')[i];i++) {
    // elegimos la primera celda de la fila
    celda = ele.getElementsByTagName('td')[0]
    // averiguamos que hay dentro de la celda
    dato = celda.innerHTML;
    // vemos si coincide con lo que se ha escrito en el cuadro de texto
    iz = dato.substr(0,txt.length);
    celda.style.display = (txt==iz) ? '' : 'none';
  }
}
</script>
</head>
<body>
<input type="text" onkeyup="buscar(this.value)" />
<table id="tabla" border="1">
<tr><td>avion</td></tr>
<tr><td>coche</td></tr>
<tr><td>aviador</td></tr>
<tr><td>coger</td>
</table>
</body>
</html> 

MorZilla 29/06/2005 08:26
Cita:
Iniciado por CHuLoSoY
P: Como deshabilito la selección de un texto?
El código de CHuLoSoy puede ser mejorado:
Código HTML:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1">
<title>Hecho por MorZilla</title>
<script type="text/javascript">
document.onselectstart = new Function("return false");
// Para IE
</script>
<style type="text/css">
* {
-moz-user-select: none; /* Para navegadores Mozilla */
user-select: none; /* Posiblemente en futuros navegadores */
}
</style>
<body>
<h1>¡MorZilla!</h1>
</body>
</html>
Ojalá les sirva! :-D

MorZilla 29/06/2005 08:39
Cita:
Iniciado por T4X
P: Cómo abrir una ventana popUp sin menus contextuales ó mejor un Dialogo Web???????

Ten en cuenta que esta función solo se desempeña en IE 5.5 y superior, aunque se está investigando si esta función de JavaScript tambien sea compatible con otros browsers.
Estas funciones sólo funcionan en IE, en Mozilla y otros navegadores provoca mensajes de error.
Recomiendo modificar el código:
Código PHP:
function verDialogo(url,nombre,argumentos) {
try {
if(window.showModalDialog) return showModalDialog(url,nombre,argumentos);
else return open(url,nombre,argumentos);
}
catch(e) { alert("Error JavaScript"); }
} 
Tengan en cuenta que no comprobé el código todavía. (Por eso incluyo el try...catch)

causita 30/06/2005 14:56
222. Rollover en diferentes celdas de una tabla
 
no soy diestro en el manejo del Javascript pero "jugando" y poniendo en práctica las clases q alguna vez tuve les pongo un script muy útil (espero no esté repetido)

P: Cómo hago un rollover para q se vea en celdas diferentes de una tabla?
R:
Cita:
<html>
<head>
<script languaje="javascript">
function cambiar(foto){
document.getElementById('mostrar').innerHTML = '<img src="' + foto + '">';
}
</script>
</head>
<body>
<table width="450">
<tr>
<td><a href="#nada" onmouseover="cambiar('1.GIF')" OnMouseout="cambiar('inicio.GIF')">foto 1</a></td>
<td><a href="#nada" onmouseover="cambiar('2.GIF')" OnMouseout="cambiar('inicio.GIF')"">foto 2</a></td>
</tr>
<tr>
<td colspan="2"><div id="mostrar"><img src="inicio.gif"></div></td>
</tr>
</table>
</body>
</html>
Espero les sea d utilidad

Trulala de cordoba 01/07/2005 13:01
223. ¿Como paso datos de una ventanita abierta a la página que la abrío en Firefox?
 
P: ¿Como paso datos de una ventanita abierta a la página que la abrío en Firefox?
R:

En firefox no funciona opener.location por lo cual para pasar datos a un campo de formulario que está en otra ventanita debemos usar esta forma:

self.opener.document.NombredelFormulario.Nombredel Campo.value ='algo'

JavierB 09/07/2005 10:31
224.- Validar entrada de datos en un formulario
 
P: Como validar que los datos que se van introduciendo en un cuadro de texto de un formulario son correcto.

R: Utilizando este código (Probado en IE 6.0 y Firefox 1.4)
Código PHP:
<html>
<head>
<script>
function validar(e) {
    tecla = (document.all) ? e.keyCode : e.which;
    if (tecla==8) return true; //Tecla de retroceso (para poder borrar)
    patron =/[A-Za-z]/; // Solo acepta letras
    //patron = /\d/; Solo acepta números
    //patron = /\w/; Acepta números y letras
    //patron = /\D/; No acepta números
    te = String.fromCharCode(tecla);
    return patron.test(te); 
} 
</script>
</head>

<body>
<input type="text" name="textfield" onkeypress="return validar(event)">
</body>
</html> 

Saruman 19/07/2005 15:01
225. cuando se presione la tecla ESCAPE se cierre una ventana
 
P: ¿Cómo hago para que cuando se presione la tecla ESCAPE se cierre una ventana?

R: así:

Código:

function _CloseOnEsc() {
if (event.keyCode == 27) { window.close(); return; }
}
function InitESC() {
document.body.onkeypress = _CloseOnEsc;
}
Utilización:

Código HTML:
<body onload="InitESC();"></body>

Saruman 26/07/2005 14:27
226.Transformar Números a Letras
 
P: ¿Cómo puedo transformar Números a Letras?

R: Utiliza las siguientes funciones para que puedas transformar números enteros en letras. Esta función soporta hasta números que van desde el Cero hasta el el Billón.

Funciones:

Código:

function letras(c,d,u)
{
var centenas,decenas,decom
var lc=""
var ld=""
var lu=""
centenas=eval(c);
decenas=eval(d);
decom=eval(u);
switch(centenas)
{
case 0: lc="";break;
case 1:
{
if (decenas==0 && decom==0)
lc="Cien"
else
lc="Ciento ";
}
break;
case 2: lc="Doscientos ";break;
case 3: lc="Trescientos ";break;
case 4: lc="Cuatrocientos ";break;
case 5: lc="Quinientos ";break;
case 6: lc="Seiscientos ";break;
case 7: lc="Setecientos ";break;
case 8: lc="Ochocientos ";break;
case 9: lc="Novecientos ";break;
}
switch(decenas)
{
        case 0: ld="";break;
        case 1:
{
switch(decom)
{
        case 0:ld="Diez";break;
        case 1:ld="Once";break;
        case 2:ld="Doce";break;
        case 3:ld="Trece";break;
        case 4:ld="Catorce";break;
        case 5:ld="Quince";break;
        case 6:ld="Dieciseis";break;
        case 7:ld="Diecisiete";break;
        case 8:ld="Dieciocho";break;
        case 9:ld="Diecinueve";break;
}
}                       
break;
case 2:ld="Veinte";break;
case 3:ld="Treinta";break;
case 4:ld="Cuarenta";break;
case 5:ld="Cincuenta";break;
case 6:ld="Sesenta";break;
case 7:ld="Setenta";break;
case 8:ld="Ochenta";break;
case 9:ld="Noventa";break;
}
switch(decom)
{
        case 0: lu="";break;
        case 1: lu="Un";break;
        case 2: lu="Dos";break;
        case 3: lu="Tres";break;
        case 4: lu="Cuatro";break;
        case 5: lu="Cinco";break;
        case 6: lu="Seis";break;
        case 7: lu="Siete";break;
        case 8: lu="Ocho";break;
        case 9: lu="Nueve";break;
}
 
if (decenas==1)
{
return lc+ld;
}
if (decenas==0 || decom==0)
{
return lc+" "+ld+lu;
}
else
{
if(decenas==2)
{
ld="Veinti";
return lc + ld + lu.toLowerCase();
}
else
{
return lc+ld+" y "+lu
}
}
}
 
function getNumberLiteral(n)
{
var m0,cm,dm,um,cmi,dmi,umi,ce,de,un,hlp,decimal;
 
if (isNaN(n)) {
alert("La Cantidad debe ser un valor Numérico.");
return null
}
m0= parseInt(n/ 1000000000000); rm0=n% 1000000000000;
m1= parseInt(rm0/100000000000); rm1=rm0%100000000000;
m2= parseInt(rm1/10000000000); rm2=rm1%10000000000;
m3= parseInt(rm2/1000000000); rm3=rm2%1000000000;
cm= parseInt(rm3/100000000); r1= rm3%100000000;
dm= parseInt(r1/10000000); r2= r1% 10000000;
um= parseInt(r2/1000000); r3= r2% 1000000;
cmi=parseInt(r3/100000); r4= r3% 100000;
dmi=parseInt(r4/10000); r5= r4% 10000;
umi=parseInt(r5/1000); r6= r5% 1000;
ce= parseInt(r6/100); r7= r6% 100;
de= parseInt(r7/10); r8= r7% 10;
un= parseInt(r8/1);
//r9=r8%1;
999123456789
if (n< 1000000000000 && n>=1000000000)
{
tmp=n.toString();
s=tmp.length;
tmp1=tmp.slice(0,s-9)
tmp2=tmp.slice(s-9,s);
 
tmpn1=getNumberLiteral(tmp1);
tmpn2=getNumberLiteral(tmp2);
 
if(tmpn1.indexOf("Un")>=0)
pred=" Billón "
else
pred=" Billones "
return tmpn1+ pred +tmpn2;
}
 
if (n<10000000000 && n>=1000000)
{
mldata=letras(cm,dm,um);
hlp=mldata.replace("Un","*");
if (hlp.indexOf("*")<0 || hlp.indexOf("*")>3)
{
mldata=mldata.replace("Uno","un");
mldata+=" Millones ";
}
else
{
mldata="Un Millón ";
}
mdata=letras(cmi,dmi,umi);
cdata=letras(ce,de,un);
if(mdata!="        ")
{
if (n == 1000000) {
        mdata=mdata.replace("Uno","un") + "de";
} else {
        mdata=mdata.replace("Uno","un")+" mil ";
}
}
 
return (mldata+mdata+cdata);
}
if (n<1000000 && n>=1000)
{
mdata=letras(cmi,dmi,umi);
cdata=letras(ce,de,un);
hlp=mdata.replace("Un","*");
if (hlp.indexOf("*")<0 || hlp.indexOf("*")>3)
{
mdata=mdata.replace("Uno","un");
return (mdata +" mil "+cdata);
}
else
        return ("Mil "+ cdata);
}
if (n<1000 && n>=1)
{
return (letras(ce,de,un));
}
if (n==0)
{
return " Cero";
}
return "No disponible"
}
Utilización:

Código:
var enteros = 50;
var resultado = getNumberLiteral(enteros)
alert(resultado)
Enjoy :arriba:

Saruman 04/08/2005 12:21
227. Validar que el usuario seleccione al menos un CheckBox
 
P: ¿Cómo puedo validar que el usuario seleccione al menos un checkbox?
R: Utilizando esta función:

Código PHP:
<script language="javascript">
function validar_checkbox() { 
var total = f.opciones.length;
var selected = false;
 
if (total != null) {
for (i=0; i<total; i++) {
    if (f.opciones[i].checked == true) {
     selected = true;
     break;
    }
}
} else {
if (f.opciones.checked == true) {
    selected = true;
}
}
 
if (selected == false) {
alert("Debe seleccionar al menos una opción.");
return false
}
}
</script> 
también puedes ver: http://www.forosdelweb.com/showpost....9&postcount=22

Enjoy! :-D

derkenuke 03/09/2005 13:01
228. Corchetes de colores con CSS en IE
 
P: Quiero utilizar
Código PHP:
a:hover:before {content: "["}
a:hover:after{content:"]"} 
sobre IE, que no lo soporta. ¿Alternativa?

R: Puedes copiar este codigo que mostrara corchetes naranjas antes y despues de todos los enlaces sólo cuando el raton esté encima. Incluso más estetico, pues no se deforma el contenido de la pagina. (Habria que tener cuidado con los enlaces que tienen como contenido imagenes y tal, eso de vuestra mano :Zzz: )

Código PHP:
<html>

<head>

<style>
.corchetes {
    color: #f93; 
    font-weight:bold;
    width:3px; 
    visibility:hidden; 
    display:inline;
}
</style>

</head>

<body>


<a href="a.htm">enlace</a> texto texto texto 
<a href="s.html">otro enlace</a> mas texto 
<a href="i.htm">y otro</a> y se acaba aqui. 

<script> 

// necesitaba dos funciones, el insertBefore que ya existe, y el insertAfter que nos lo sacamos de la manga
function insertAfter(parent, node, referenceNode) {
    parent.insertBefore(node, referenceNode.nextSibling);
}

// la coleccion de <a> (anchors)
var As=document.getElementsByTagName("A"); 
var corchete1,corchete2;

//por cada enlace
for(var a=0;a<As.length;a++) {

    //quitamos los espacios anteriores y posteriores a los enlaces, que si no con el corchete oculto parecera doble espaciado
    var anterior = As[a].previousSibling;
    if(anterior!=null) {
        anterior.nodeValue  = anterior.nodeValue.substr(0,anterior.nodeValue.length-1); 
    }
    var siguiente = As[a].nextSibling;
    if(siguiente!=null) {
        siguiente.nodeValue = siguiente.nodeValue.substr(1);
    }
    
    //creamos los corchetes, y les aplicamos el estilo "corchetes"
    corchete1=document.createElement("DIV");
    corchete2=document.createElement("DIV");
    corchete1.appendChild( document.createTextNode("[") );
    corchete2.appendChild( document.createTextNode("]") );
    corchete1.className=corchete2.className="corchetes";
    
    //insertamos los corchetes antes y despues del enlace
    As[a].parentNode.insertBefore( corchete1 , As[a] );
    insertAfter( As[a].parentNode, corchete2, As[a] );
    
    //los eventos que se ocuparan de poner los enlaces y quitarlos
    As[a].onmouseover=function() { 
        this.previousSibling.style.visibility="visible";
        this.nextSibling.style.visibility="visible";
    }
    As[a].onmouseout=function() { 
        this.previousSibling.style.visibility="hidden";
        this.nextSibling.style.visibility="hidden";
    }
}

</script>


</body>

</html> 
Debe ir al final de la pagina, por supuesto.

:adios: :adios:

KarlanKas 06/09/2005 01:57
229. Contador de palabras en un textarea
 
P. Cómo contar el número de palabras que se van escribiendo en un textarea?
R. Por medio de este código, en el que además se puede determinar la cantidad mínima de caracteres que ha de tener una palabra para ser contabilizada.

Código PHP:
<html>
<head>
    <title>Untitled</title>
    <style>
    textarea{
    overflow:auto;
    text-align:justify;
    }
    input{text-align:right;}
    
    input,textarea{
    border:solid 1px black;
    font:normal 10px/15px verdana;
    color:navy;
    }
    </style>
    <script>
//  Contador de palabras
//  Script de Karlankas para forosdelweb.com
//  http://www.karlankas.net    
    minimoLetras=3;//Cuantas letras tiene que tener como mínimo la palabra para ser contabilizada
    function contar(esto){
    if(esto.value.charAt(esto.value.length-1)==" "){
    numeroDePalabras=0;
    textos=esto.value;
    palabras=textos.split(" ");
    for(a=0;a<palabras.length;a++){
    if(palabras[a].length>=minimoLetras){
    numeroDePalabras+=1;
    }
    }
    document.forms['pepe']['palabras'].value=numeroDePalabras;
    }
    }
    </script>
</head>

<body>
<form name="pepe">
<textarea onkeyup="contar(this)" cols="50" rows="10" name="texto" id="texto"></textarea> <input type="text" name="palabras" id="palabras" size="3" maxlength="3" readonly>
</form>


</body>
</html> 
Un saludo! :adios:

KarlanKas 09/09/2005 05:06
230. Añadir desde un text box una opción a un select
 
P: ¿Cómo añadir desde un textbox una opción a un select y como borrar una opción del select con un botón?
R: Con este código:

Código PHP:
<html>
<head>
<title>Untitled</title>
<script>

//Script hecho por Karlankas para las FAQ de forosdelweb.com

function mandarlo(){
    
    formulario=document.forms['estacosa'];
    ultimaOpcion=formulario['cosas'].options.length;
    texto=formulario['palabras'].value;
    valor=formulario['palabras'].value;
    
    if(texto!=""){
        nuevaOpcion=new Option(texto,valor);
        formulario['cosas'].options[ultimaOpcion]=nuevaOpcion;
        formulario['palabras'].value="";
        formulario['cosas'][0].text="Opcion Añadida";
        opcionElegida=formulario['cosas'].selectedIndex=0;
        setTimeout('formulario["cosas"][0].text="Elige una opción";',800);
        
    }
}

function borrar(){
    formulario=document.forms['estacosa'];
    if(formulario['cosas'].selectedIndex>0){
        opcionElegida=formulario['cosas'].selectedIndex;
        formulario['cosas'].options[opcionElegida]=null;
        formulario['cosas'][0].text="Opcion Borrada";
        opcionElegida=formulario['cosas'].selectedIndex=0;
        setTimeout('formulario["cosas"][0].text=(formulario["cosas"].options.length>1)?"Elige una opción":"No hay opciones";',800);
        
    }
}
</script>
<style>
*{font:normal 10px/10px verdana;}
input{
border:ridge 2px;
}
</style>
</head>

<body>
<form action="" id="estacosa" name="estacosa">
    <input type="text" name="palabras" id="palabras" />
    <input type="button" name="mandar" id="mandar" value="->" onclick="mandarlo()" onclick="mandarlo()" />
    <select style="width:150px;" id="cosas" name="cosas" size="1">
        <option>No hay opciones</option>
    </select>
    <input type="button" style="color:red;font:bold 10px verdana" value="X" onclick="borrar()" />
</form>


</body>
</html> 
En la function mandarlo hay 2 variables que son texto y valor, las distingo por si se quiere añadir algo al texto introducido en el valor de la opción. También se podría hacer otro textbox para introducir el valor.

Un saludo!

programeitor 11/09/2005 17:02
231.- Aplicar estilos por tipo
 
.:-)


Esta funcion sirve para aplicar estilo a una clase de 'tags' que tenga varios tipo ,como es el caso de <input> ,type=text, type=radio, etc...



function EstiloPorTipo(marca,tipo,estilo){// programeitor
var e=estilo.split(',');
var m=document.getElementsByTagName(marca);
for(var n=0;n<m.length;n++){
if(m[n].type==tipo){
for(var i=0;i<e.length;i+=2){
m[n].style[e[i]]=e[i+1];
}
}
}
}:arriba:


La llamada se realiza de esta forma una vez cargada la pagina:

EstiloPorTipo('input','radio','background,green,width,50px,height,50px'):arriba:


Como se puede apreciar se pueden pasar varios conceptos a la vez, separados por comas.


.:adios:

JavierB 24/09/2005 03:21
231.- Recorrer los elementos de un formulario con la tecla Enter
 
P.- ¿Como puede recorrer los elementos de un formulario pulsando la tecla Enter en lugar de usar el tabulador?

R.- Usando este código:
Código PHP:
<html>
<head>
<script>
function tabular(e,obj) {
  tecla=(document.all) ? e.keyCode : e.which;
  if(tecla!=13) return;
  frm=obj.form;
  for(i=0;i<frm.elements.length;i++)
    if(frm.elements[i]==obj) {
      if (i==frm.elements.length-1) i=-1;
      break }
  frm.elements[i+1].focus();
  return false;
}
</script>
</head>
<body>
<form>
<input type="text" onkeypress="return tabular(event,this)" />
<input type="text" onkeypress="return tabular(event,this)" />
</form>
</body>
</html> 

JavierB 06/10/2005 09:26
232.- Validar (mientras se teclea) la introducción de datos en un formulario
 
P.- ¿Como puedo validar que lo que teclea un usuario son solo letras, solo números o no son números?

R.- Con estas pocas líneas de código:
Código PHP:
<html>
<head>
<script type="text/javascript">
function validar(e) {
    tecla = (document.all) ? e.keyCode : e.which;
    if (tecla==8) return true; //Tecla de retroceso (para poder borrar)
    // dejar la línea de patron que se necesite y borrar el resto
    patron =/[A-Za-z]/; // Solo acepta letras
    //patron = /\d/; // Solo acepta números
    //patron = /\w/; // Acepta números y letras
    //patron = /\D/; // No acepta números
    //
    te = String.fromCharCode(tecla);
    return patron.test(te); 
} 
</script>
</head>

<body>
<input type="text" name="textfield" onkeypress="return validar(event)">
</body>
</html> 

Saruman 06/10/2005 12:24
233. Hora en Formato de 12 Horas (AM y PM)
 
P. - ¿Cómo agregar la hora en formato de 12 horas (AM y PM) en cualquier parte de nuestro sitio?

R. -

Función JS
Código HTML:
<script>
function actualizaReloj(){
 marcacion = new Date();
 Hora = marcacion.getHours();
 Minutos = marcacion.getMinutes();
 Segundos = marcacion.getSeconds();
 
 if (Hora >= 12) {
  var Horario = "P.M."
 } else {
  var Horario = "A.M."
 }
 
 switch (Hora) {
  case 0:
  Hora = 12;
  break;
  case 13:
  Hora = 1;
  break;
  case 14:
  Hora = 2;
  break;
  case 15:
  Hora = 3;
  break;
  case 16:
  Hora = 4;
  break;
  case 17:
  Hora = 5;
  break;
  case 18:
  Hora = 6;
  break;
  case 19:
  Hora = 7;
  break;
  case 20:
  Hora = 8;
  break;
  case 21:
  Hora = 9;
  break;
  case 22:
  Hora = 10;
  break;
  case 23:
  Hora = 11;
  break;
 }
 
 if (Hora<=9)
 Hora = "0" + Hora;
 
 if (Minutos<=9)
 Minutos = "0" + Minutos;
 
 if (Segundos<=9)
 Segundos = "0" + Segundos ;
 
 var Script = Hora + ":" + Minutos + " " + Horario;
 
 document.getElementById('Reloj').innerHTML = Script;
 setTimeout("actualizaReloj()",1000)
}
</script>
en el HTML:
Código HTML:
<table width="100%" height="24" align="center" border="0" cellspacing="0" cellpadding="0" style="color:#000000;">
  <tr>
    <td id="Reloj" style="font-weight:bold;"><script language="javascript">actualizaReloj()</script></td>
  </tr>
</table>
Enjoy! :arriba:

Saruman 07/10/2005 09:44
234. Remover Link
 
P. - ¿Cómo quito o remuevo un link?

R. - Utilizando la siguiente función:

Código PHP:
function QuitarLink(my_link) {
  var mylink = document.getElementById(my_link);
  if (mylink) {
   if (mylink.hasChildNodes()) {
    for(var i=0;i<mylink.childNodes.length;i++)
     mylink.parentNode.insertBefore(mylink.childNodes[i].cloneNode(true),mylink);
    mylink.parentNode.removeChild(mylink);
   }
  }
 } 
Utilización:

Código HTML:
<a id="id_link" href=http://www.forosdelweb.com target="_blank"><img src="mi_imagen.gif" width="100" height="100"></a>
<input type="button" value="Quitar Link" onClick="QuitarLink('id_link')">
Cheers!! :-D

el_javi 17/10/2005 03:45
235. Tooltip personalizado sobre elementos de Formulario
 
P.- ¿Como puedo poner sobre elementos SELECT, TEXTAREA de un formulario una capa, a estilo Tooltip?

R.- Tras varios días de estudio, he llegado a la forma de conseguirlo.

Poder poner una capa sobre un formulario, y que en IE, NO SE OCULTE TRAS LOS ELEMENTOS SELECT Y TEXTAREA.

Bueno, pues hay una manera de solucionarlo.

Quizás, no sea la manera más profesional pero por el momento, es la que mejor sirve para salir del paso.

Os comento la lógica, y después paso el código:

Como el problema es que la capa (DIV) se pasa a segundo plano, detras del SELECT o TEXTAREA, pues hay que encontrar un OBJETO que SI quede por encima de dichos elementos.

¿Y si usamos un IFRAME, que esté continuamente detras de la capa, y que el iframe este sin bordes, e invisible?
Pues es la mejor solución que hasta el momento e encontrado.

Si, un IFRAME, detras siempre de la capa, para que haga de TAPADERA sobre el SELECT o TEXTAREA.

A continuación os pongo el código:

Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
        <title>Capa sobre Formulario</title>
        <style type="text/css">
                .sp{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 1px;text-decoration:none;color: #EFEFEF;line-height:1px}
        </style>
        <script language="JavaScript1.2" type="text/javascript">

                // Función encargada de desplazar la capa por el documento
                function desplazar_capa(evt)
                {
                        // Capturamos el Evento
                        var e = (window.event) ? window.event : evt;
                       
                        // Instanciamos los dos objetos
                        var capa = document.getElementById("capa");
                        var obj_iframe_oculto = document.getElementById("iframe_oculto");
                       
                        // Determinamos las coordenadas del raton.
                        X = e.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
                        Y = e.clientY + document.documentElement.scrollTop + document.body.scrollTop;
       
                        // Mostramos las coordenadas del raton por pantalla
                        document.getElementById("info").innerHTML = "X= " + X + "  Y = " + Y;
                       
                       
                        // Movemos la capa a las coordenadas del raton
                        capa.style.left = X + 10;
                        capa.style.top = Y + 25;
                       
                        // Ponemos a nuestra capa una opacidad para que sea algo transparente y se vea el contenido del fondo
                        capa.style.filter="alpha(opacity=85)"; // Opacidad para IE
                        capa.style.opacity="0.85"; // Ocapacidad para Netscape

                        // Quitamos al Iframe TODA la opacidad para que sea totalmente transparente y se vea el fondo
                        obj_iframe_oculto.style.filter="alpha(opacity=0)"; // Opacidad para IE
                        obj_iframe_oculto.style.opacity="0.00"; // Ocapacidad para Netscape

                        // Hacemos que la capa sea totalmente visible
                        capa.style.display = "block";
                        // Definimos el ancho del IFRAME igual que el ancho de la capa, para que no se le vea
                        obj_iframe_oculto.style.width = capa.offsetWidth;
                        obj_iframe_oculto.style.height = capa.offsetHeight;
                        // Posicionamos el IFRAME en la misma posición que la capa (para que esté siempre detras)
                        obj_iframe_oculto.style.top = capa.style.top;
                        obj_iframe_oculto.style.left = capa.style.left;
                        // Bajamos de Z-index el IFRAME, para que esté debajo de la capa
                        obj_iframe_oculto.style.zIndex = capa.style.zIndex - 1;

                        // Definimos que el contenido del IFRAME esté VISIBLE
                        obj_iframe_oculto.style.display = "block"; // ESTA ES LA LINEA MAS IMPORTANTE
                }
        </script>
</head>
<body style="margin:0px" onmousemove="desplazar_capa(event);">
<table cellpadding="0" cellspacing="0" style="width:100%;height:100%" border="0">
        <tr>
                <td width="100%" height="100%" class="sp" align="center" valign="middle">
                        <form action="javascript:void(null)">
                        <table cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                        <td width="150" height="25" align="left" valign="top">Select Multiple</td>
                                        <td width="150" align="left" valign="top">Select Normal</td>
                                        <td width="150" align="left" valign="top">Textarea</td>
                                        <td width="150" align="center" valign="top">Boton</td>
                                        <td width="150" align="left" valign="top">Checkbox</td>
                                        <td width="150" align="left" valign="top">Radiobutton</td>
                                </tr>
                                <tr>
                                        <td colspan="6" width="100%" height="1" bgcolor="#000000" class="sp">&nbsp;</td>
                                </tr>
                                <tr>
                                        <td colspan="6" width="100%" height="20" class="sp">&nbsp;</td>
                                </tr>
                                <tr>
                                        <td width="150" align="left" valign="top"><select multiple><option>Elemento Select</option></select></td>
                                        <td width="150" align="left" valign="top"><select><option>Elemento Select</option></select></td>
                                        <td width="150" align="left" valign="top"><textarea style="width:150px;height:150px"></textarea></td>
                                        <td width="150" align="center" valign="top"><input type="Button" value="Boton"></td>
                                        <td width="150" align="left" valign="top"><input type="Checkbox" value="Checkbox"></td>
                                        <td width="150" align="left" valign="top"><input type="Radio" value="Radiobutton"></td>
                                </tr>
                                <tr>
                                        <td colspan="6" width="100%" height="20" class="sp">&nbsp;</td>
                                </tr>
                                <tr>
                                        <td colspan="6" id="info" align="center"></td>
                                </tr>
                        </table>
                        </form>
                </td>
        </tr>
</table>
<div id="capa" style="position:absolute; top:25px; left:50px; width:100px; height:40px padding:4px; display:none; background-color:#7598DE; color:#ffffff; z-index:100;">Esta es nuestra capa en la que tenemos el texto.<br><br>¿Se ocultará tras el SELECT?</div>

<iframe id="iframe_oculto" scrolling="no" frameborder="0" style="position:absolute; top:0px; left:0px; display:none;"></iframe>

</body>
</html>
Espero que esto os sea de ayuda... y si hay algún comentario, hacermelo saber, que para eso estamos.. para seguir aprendiendo.

Un saludo :adios:

ludovico2000 30/12/2005 11:00
236.- "deplegar" select onmouseover
 
P.- ¿Cómo puedo hacer que PAREZCA que un select se despliega solo cuando paso el ratón por encima?

R.-Con estas funciones que primero, le dan el foco, y luego cambian el size de "lo que haya" a "1":

Código:
<html>
<head>
</head>
<script>
function abrir(meabro){
meabro.focus();
meabro.size = meabro.options.length;
}
</script>

<script>
function cerrar(mecierro){
mecierro.focus();
mecierro.size = "1";
}
</script>
<body>
<form method="POST" action="loquesea.php">
  <p>&nbsp;</p>
  <p><select style="readonly" name="selectuno" onmouseover="abrir(selectuno)" onmouseout="cerrar(selectuno)">
    <option value="uno" selected>uno</option>
    <option value="dos">dos</option>
    <option value="tres">tres</option>
  </select></p>
  <p><input type="submit" value="Enviar" name="1"><input type="reset" value="Restablecer" name="B2"></p>
</form>
</body>
</html>

Callaghan 24/02/2006 19:28
237.- Selector de año, mes y día (Modificacion del 111)
 
P:¿Como puedo hacer un selector de fecha basado en tags <select> que permita seleccionar cualquier fecha válida hasta el día de hoy?

R:

Esta es una modificacion sobre el ejemplo 111 de Kaopectate.
Me ha sido muy util ese ejemplo y le he hecho unas modificaciones que creo que lo hacen mejor.

-Con el codigo del FAQ 111, debes seleccionar primero el año, luego el mes y finalmente el dia. Cuando cambias el año, los campos mes y dia se resetean y cuando cambias el mes, el campo dia se resetea.
En la modificacion esto ya no ocurre puedes seleccionar las caracteristicas en el orden que quieras y si cambias una el resto no se resetean.
La unica restriccion es que por ejemplo tengas elegido como dia el 31 de Enero y cambies en el campo "mes" Enero por Abril, en este caso te seleccionaria el ultimo dia disponible, osea el 30 de abril.

Código PHP:
<?php BEGIN__VBULLETIN__CODE__SNIPPET <html>
 <head>
  <script language="JavaScript">

   var aMeses = new Array("Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre")

function padNmb(nStr, nLen, sChr){
    var sRes = String(nStr);
    for (var i = 0; i < nLen - String(nStr).length; i++)
     sRes = sChr + sRes;
    return sRes;
   }

function makeDateFormat(nDay, nMonth, nYear){
    var sRes;
    sRes = padNmb(nDay, 2, "0") + "/" + padNmb(nMonth, 2, "0") + "/" + padNmb(nYear, 4, "0");
     return sRes;
   }
   
function addOpt(oCntrl, iPos, sTxt, sVal){
    var selOpcion = new Option(sTxt, sVal);
    oCntrl.options.add(selOpcion, iPos);
   }

function lastDayOfMonth(nMonth, nYear){
    var aMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    if ((nMonth == 2) && (nYear % 4 == 0))
     return 29;
    else
     return aMonth[nMonth - 1];
   }

function cambia(nCambiado){
    var nAno;
    var nMes;
    with (document.frm){     
     nAno = parseInt(ano.options[ano.selectedIndex].value);
     switch (nCambiado){
      case 0:
       llenaMes(mes, nAno);
       nMes = parseInt(mes.options[mes.selectedIndex].value);
       nDia = parseInt(dia.options[dia.selectedIndex].value);
       res.value = makeDateFormat(nDia, nMes + 1, nAno);  
       break;
      case 1:
       nMes = parseInt(mes.options[mes.selectedIndex].value);
       llenaDia(dia, nAno, nMes);
       nDia = parseInt(dia.options[dia.selectedIndex].value);
       res.value = makeDateFormat(nDia, nMes + 1, nAno);
       break;
      case 2:
       nMes = parseInt(mes.options[mes.selectedIndex].value);
       nDia = parseInt(dia.options[dia.selectedIndex].value);
       res.value = makeDateFormat(nDia, nMes + 1, nAno);
       break;
      case 3:
          llenaMes(mes, nAno);
      break;
     }
    }
   }

function llenaAno(oAno){
      var hoy = new Date();
    var ini = 1960;
       for (var i = ini; i <= hoy.getYear(); i++)
     addOpt(oAno, i - ini, String(i), String(i));
     oAno.options[i-ini-1].selected = true;
     cambia(3);
}

function llenaMes(oMes, nAno){
    var hoy = new Date();
    var sel=0;
    if(oMes.selectedIndex >=0) var sel=oMes.selectedIndex;
    var nFin = 11;
    while (oMes.length > 0) oMes.remove(0);
    if (nAno == hoy.getYear()) 
    {
    nFin = hoy.getMonth();
    } 
    if (sel>nFin)
        {
            sel=nFin-1;
        }  
    for (var i = 0; i <= nFin; i++)
     addOpt(oMes, i, aMeses[i], String(i));
     oMes.options[sel].selected = true;
     cambia(1);
   }

function llenaDia(oDia, nAno, nMes){
    var hoy = new Date();
    var sel=0;
    if(oDia.selectedIndex >=0) var sel=oDia.selectedIndex;
    var nFin = lastDayOfMonth(nMes + 1, nAno);
    while (oDia.length > 0) oDia.remove(0);
     if (nAno == hoy.getYear() && nMes == hoy.getMonth()) 
    {
    nFin = hoy.getDate();
    }
    if(sel>nFin)
        {
            sel=nFin-1;
        }
    for (var i = 1; i <= nFin; i++)
     addOpt(oDia, i, String(i), String(i));
        oDia.options[sel].selected = true;
   }

  </script>
 </head>
 <body onload=" llenaAno(document.frm.ano)">
  <form name="frm">
   <table border="0">
    <tr>
     <td align="right">
      Año: 
     </td>
     <td>
      <select name="ano" onchange="cambia(0)" style="width: 80">
      </select>
     </td>
    </tr>
    <tr>
     <td align="right">
      Mes: 
     </td>
     <td>
      <select name="mes" onchange="cambia(1)" style="width: 80">
      </select>
     </td>
    </tr>
    <tr>
     <td align="right">
      Día: 
     </td>
     <td>
      <select name="dia" onchange="cambia(2)" style="width: 80">
      </select>
     </td>
    </tr>
    <tr>
     <td align="right">
      Fecha:
     </td>
     <td>
      <input type="text" name="res" disabled>
     </td>
    </tr>
   </table>
  </form>
 </body>
</html>

bertoski 21/06/2006 22:34
238.- Links que cambian de color cuando se pasa el puntero sobre ellos
 
P: ¿Como puedo hacer que los links de mi menu cambien de color cuando se les pase el puntero por encima?

R: Estas funciones logran que cuando se pase el puntero por encima de los links cambien de color, cuando se hace un click sobre uno cambie a un tercer color solo por un momento para resaltar el click y que el ultimo que ah sido clickeado quede como "activo" (el color queda fijado sobre el) hasta que se haga click en otro y el otro quede como "activo", ademas si hay uno "activo" y se pasa el puntero sobre otro link pasa a estar como "inactivo" mientras se mantenga el puntero sobre otro link, si no se hace click sobre ningun otro vuelve a estar "activo" una vez que el puntero no esta sobre ningun otro link.

Head:
Código:
function configurarcolor(colorcambio,colorclick,inicial){
if(inicial == "no"){
    nombrem = "";
}else{
    nombrem = inicial;
}
coloran = "";
colorca = colorcambio;
colorc = colorclick;
}
 
function cambiarcolor(nombre, mantener){
font = document.getElementById(nombre);
if(nombre != nombrem){
    if(coloran == ""){
    coloran = font.style.color;
    }
    if(mantener != "mantener"){
        if(nombrem == ""){
            if(font.style.color == coloran){
                font.style.color = colorca;
            }else{
                font.style.color = coloran;
            }   
        }else{
            fontm = document.getElementById(nombrem);
            if(font.style.color == coloran){
                fontm.style.color = coloran;
                font.style.color = colorca;
            }else{
                fontm.style.color = colorca;
                font.style.color = coloran;
            }           
        }
    }else{
        nombrem = nombre;
    }
}else{
fontm = document.getElementById(nombrem);
fontm.style.color = colorca;
}
}
 
function colorclick(nombre){
font = document.getElementById(nombre);
if(font.style.color == colorca){
font.style.color = colorc;
}else{
font.style.color = colorca;
}
}
Body:
colordecambio es el color que van a tener los links cuando se pasa el puntero sobre ellos, colorenclick es el color "momentaneo" que tienen cuando se les hace click y idlink es opcional, sirve para tener uno como "activo" cuando se carga la pagina.
Código:
<body onLoad='configurarcolor("colordecambio","colorenclick","idlink");'>
Links:
Los links deben llevar el color de "desactivado" en style="color:#color", si se eligio un link para que aparezca como activo se debe usar en el link que se eligio el "colordecambio" que se declaro en body.
Código:
<a id="ejemplo" style="color:#FFFFFF;" onMouseOver="cambiarcolor('ejemplo');" onMouseOut="cambiarcolor('ejemplo');" onClick="cambiarcolor('ejemplo','mantener');" onMouseDown="colorclick('ejemplo');" onMouseUp="colorclick('ejemplo');" href="ejemplo.html">Ejemplo</a>
Para sacar el Pre-Formato que tienen los links se puede usar esto, debe ir en head:

Código:
<style type="text/css">
A{
text-decoration: none;
}
</style>
Espero que sea de utilidad, si tienen algun comentario o pueden mejorar el codigo haganmelo saber.Suerte.

Berto.

MasLibertad 10/07/2006 04:08
Comprobar dirección de Mail
 
P: ¿Cómo comprobar una dirección de mail?

R:

He visto varias funciones usadas para comprobar e-mail y quisiera participar en el foro con la función que yo uso para ello.

Este es mi primer mensaje, por lo que pido perdón de antemano si no soy capaz de mostrarlo correctamente.

Código:
function CompruebaMail(Campo)
{
  if (Campo.value == '') return false;
  Campo.value = Campo.value.toLowerCase();
  Campo.value = Campo.value.replace(/ /g, "");
  if (/\.\.|\.@|@\.|^\.|\.$/.test(Campo.value))
      return false;
  if (/\.([a-z]{2,3}|info|name|museum)$/.test(Campo.value))
      if (/^[_\.0-9a-z-]+@([0-9a-z-]+\.)+[a-z]*$/.test(Campo.value))
        return true;
  return false;
}
y ahora paso a explicar la función:
En primer lugar compruebo que el campo a verificar está vacío, en cuyo caso termina devolviendo FALSE
A continuación convierto el campo en minúsculas y le elimino todos los espacios.
Uso la función .test(), que sólo he visto documentada en MSDN y que permite comprobar máscaras de "Expresiones Regulares", es decir, comprobar si una cadena se ajusta a un formato determinado usando un lenguaje estándar que puede ser usado en numerosos lenguajes de programación. (JavaScript y PHP entre otros)
La sintaxis de la comprobación en javascript sería
Código:
if (/ExpresiónRegular/.test(VariableAComprobar))
y devolvería true si en la VariableAComprobar se encuentra un trozo que se ajuste al formato de la ExpresiónRegular.
En PHP se usaría
Código PHP:
if (ereg($ExpresionRegular, $VariableAComprobar)) 
La primera ExpresionRegular es "\.\.|\.@|@\.|^\.|\.$" y comprueba si la VariableAComprobar contiene ".." ó ".@" ó "@." ó no contiene ningún "." ó hay un punto al final de la Variable. Si ocurre cualquiera de estas cosas, la dirección se considera incorrecta y retorna FALSE.
La segunda ExpresiónRegular es "\.([a-z]{2,3}|info|name|museum)$" y comprueba el final de la VariableAComprobar. Si encuentra un "." seguido de una cadena de sólo letras, de dos o tres caracteres (lo que incluye todas las terminaciones de países y terminaciones "com", "net", "etc"), ó "info" ó "name" ó "museum" SEGUIDOS del final de la cadena, se considera que el mail, provisionalmente sigue siendo válido y podemos hacer la última comprobación.
La tercera ExpresionRegular es "^[_\.0-9a-z-]+@([0-9a-z-]+\.)+[a-z]*$" y comprueba que desde el inicio de la cadena ("^") haya un tramo de caracteres que solo incluyan "_", ".", números, letras ó "-", seguido de "@" y uno o varios tramos de Letras, Numeros o "-" seguidos de un punto, y termine en una cadena de letras seguida de Fin de Cadena ("$"). En caso de que la máscara sea correcta, significará que la dirección de email es muy probable que sea válida.
Si quisiéramos hacer una comprobación completa tendríamos que hacer que la segunda condición incluyera TODAS las terminaciones de dominio ("es", "uk", "mx", "cl", "com", "net", y muchos etcéteras), con lo que lo que se ganaría en seguridad se perdería bastante en velocidad de proceso y claridad del programa, por lo que no lo recomiendo.

Es muy fácil incluir una rutina de Comprobación de Formularios
El botón Submit debe incluir la función "onClick()" de la siguiente forma

Código:
<input type=submit value=Aceptar name=Boton onClick="return CompruebaForm();"/>
y en nuestro script de JavaScript añadir las funciones CompruebaMail (ya escrita) y
Código:
function CompruebaForm()
{ 
  if (document.Form1.Mail.value == '')
  {
      alert('Debe rellenar el campo e-Mail');
      document.Form1.Mail.focus();
      return false;
  }
  if (!CompruebaMail(document.Form1.Mail))
  {
      alert('La dirección de e-mail no es válida');
      document.Form1.Mail.focus();
      return false;
  }
  return true;
}
Con todo ello, podemos incluir la solicitud de e-mail en cualquier formulario y nos aseguramos, primero de que se rellene el campo de Mail, y segundo, que el mail introducido es correcto.

Para terminar, hay forofos de la programación que intentan hacer en una sola expresión regular TODAS las comprobaciones. Se puede hacer, pero la expresión regular es tan larga y compleja que, a mí personalmente, no me compensa, pero si alguien quiere intentarlo, adelante.

Espero que esto os sirva.

urgido 23/07/2006 05:49
Jcap (Captcha Validation Javascript)
 
P: CREAR UNA IMÁGEN DE VERIFICACIÓN
R: NAVEGANDO ME ENCONTRE CON ESTE SCRIPT, LO CAMPRTO CON UDS.


http://www.archreality.com/jcap/

CRÉDITOS: Jonathan Feaster
NOTA: LA WEB ESTA EN INGLÉS PERO CREANLO VALE LA PENA :)

urgido 09/10/2006 23:40
P: Agrandar / Disminuir texto de una página
R: Función realmente efectiva para personas que les gusta cambiar el estilo de la fuente a la página sin necesidad de mover funciones al navegador.

Código PHP:
// Tags a las cuales se les va a aplicar el script:
var tgs = new Array( 'div','td','tr','span','p');

// Intervalos de las fuentes, en este caso de menor-mayor:
var szs = new Array( 'xx-small','x-small','small','medium','large','x-large','xx-large' );
var startSz = 2;

function ts( trgt,inc ) {
    if (!document.getElementById) return
    var d = document,cEl = null,sz = startSz,i,j,cTags;
    
    sz += inc;
    if ( sz < 0 ) sz = 0;
    if ( sz > 6 ) sz = 6;
    startSz = sz;
        
    if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];

    cEl.style.fontSize = szs[ sz ];

    for ( i = 0 ; i < tgs.length ; i++ ) {
        cTags = cEl.getElementsByTagName( tgs[ i ] );
        for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
    }
} 
Link para poner en tu web(de preferencia en el top de tu página):
Código HTML:
<a href="javascript:ts('body',1)">Agrandar Texto</a> | <a
href="javascript:ts('body',-1)">Disminuir Texto</a>

crcbad 10/10/2006 05:09
USANDO Y MANEJANDO ACTIVEX I

P1: Notas.

ActiveX es una tenología que permite utilizar objetos OLE dentro de páginas web, siendo creados por Microsoft y siendo válidos desde la versión 3.0 del IE.

Es una tecnología que en el mundo web está bastante mal usada, y es la fuente de incursión de muchos tipos de datos peligrosos en nuestro PC por tener acceso al sistema de fichero de la persona que ejecuta el ActiveX, por lo que por seguridad siempre se encuentra desactivada la opción de ejecutar ActiveX. No obstante, los antivirus y antytroyanos ayudan a que ningún código peligros pudiera entrar.

No obstante, tiene sus ventajas el acceder a dichas propiedades de la colección de ActiveX, y yo, voy a poner algún ejemplo de ello.

-------------------------------
P2: Apertura, Lectura y Cierra de un fichero.

La función a la que llamaremos es:

Código PHP:
function lecturaActiveX(directorio,archivo)
{
 // Creamos objeto a la librería FileSystemObject
 var objSystem = new ActiveXObject("Scripting.FileSystemObject");
 
 // Comprobamos que el directorio exista
 if (fso.folderexists(directorio) == false) 
  return false;
 
 else
 { 
  var rutaCompleta = directorio + fichero;
 
  // Comprobamos que el fichero exista
  if(objSystem.FileExists(rutaCompleta ) == false) 
   return false;
 
  else 
  {
   // Abrimos el fichero con la ruta seleccionada
   var objFichero = objSystem.OpenTextFile(rutaCompleta ,1);
 
   // Método para leer el contenido del fichero
   var datosFichero = objFichero.readall();
 
   // Cierra de fichero
   objFichero.close();
 
  // Envío de la información, por ejemplo a un TextArea
   return datosFichero ; 
  }
 }
} 
Nota: Si en el directorio ponemos la ruta de nuestro PC con la barra "\" nos dará error, tenemos que escapar esa barra con "\\".

-------------------------------
P3: Apertura, Modificación y Cierre de un fichero.

Ahora lo mismo, pero modificando la información de un fichero con alguna nueva, es decir, haciendo una operación de agregación de datos, esta vez pondré un ejemplo tal cual tengo en un HTML:

Código PHP:
function guardadoInfo()
 // Arreglo temporal con ActiveX para guardar el codigo en el fichero
 modo = 1;
 
 // Esta línea la podéis quitar :P
 rutaCompleta = rTrim(app.replace(/&#199;/g, '\\')) + nomFich;
 
 // Creamos objeto FileSystemObject
 var fso = new ActiveXObject("Scripting.FileSystemObject");
 
 // Caso de que no exista el fichero
 if(fso.FileExists(rutaCompleta) == false && modo==0) 
  return false;
 
 // Si estamos en modo append guardamos todo el contenido del fichero
 if(fso.FileExists(rutaCompleta) != false && modo==2) 
 {
  fich = fso.OpenTextFile(rutaCompleta,1);
  temporal = fich.readall(); 
  fich.close(); 
 }
 
 else 
  temporal = "";
 
 // Objeto para crear un nuevo fichero con la info del antiguo más lo que queremos agregar
 fich = fso.CreateTextFile(rutaCompleta,2);
 
 // Escribimos dicho contenido en el objeto fich
 fich.write(temporal + document.getElementById("codigo").innerText);
 
 // Cierra del fichero
 fich.close();
} 
-------------------------------
P4: Ejecución de comandos mediante ActiveX.

Código PHP:
function ejecutaComando() 
{
 // Creamos objeto shell
 var objShell= new ActiveXObject("WScript.Shell");
 
 // Parámetro 1 -> Ruta: Ruta completa con el comando a ejecutar
 // Parámetro 2 -> Modo: 0: Oculto, 1: normal, 2: minimizado, 3: maximizado, 4: normal sin foco 
 // Parámetro 3 -> Instancia: false:Múltiples instancias, true: Solo una.
 
 var ejecuta = objShell.run("C:\\ARCHIV~1\\OFFICE\\WORD.EXE, 2, true);
return ejecuta;
} 
-------------------------------

Como véis, lo que se puede hacer es realmente grande, pero exige que el administrador de la máquina tiene una configuración bien realizada para que solamente ejecute ActiveX de confianza, bien de una determinada web, o bien de una determinada intraner, o bien de un determinado grupo de dominios.

Saludos

urgido 15/10/2006 18:24
P: Desactivar click derecho a las imágenes.
R: Con un poco de javascript esto es posible.

Código PHP:
<script language="JavaScript1.2">

var mensajealclick="El click derecho no esta permitido!"

function desactivarclick(e) {
if (document.all) {
if (event.button==2||event.button==3) {
if (event.srcElement.tagName=="IMG"){
alert(mensajealclick);
return false;
}
}
}
else if (document.layers) {
if (e.which == 3) {
alert(mensajealclick);
return false;
}
}
else if (document.getElementById){
if (e.which==3&&e.target.tagName=="IMG"){
alert(mensajealclick)
return false
}
}
}

function imagenesasociadas(){
for(i=0;i<document.images.length;i++)
document.images[i].onmousedown=desactivarclick;
}

if (document.all)
document.onmousedown=desactivarclick
else if (document.getElementById)
document.onmouseup=desactivarclick
else if (document.layers)
imagenesasociadas()
</script> 

KarlanKas 27/10/2006 02:17
añadir, cambiar y quitar opciones de un select
 
P.-¿Como añadir, cambiar y quitar opciones de un select por medio de javascript?
R.- Ver este hilo.

Panino5001 28/10/2006 07:54
245.-Sencillo editor bbCode
 
P:Cómo hacer un editor de bbCode sencillo que admita selección de texto?
R:
Código:
<html>
<head>
<title>Editor bbCode</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function instag(tag){
var input = document.form1.contenido;
if(typeof document.selection != 'undefined' && document.selection) {
var str = document.selection.createRange().text;
input.focus();
var sel = document.selection.createRange();
sel.text = "[" + tag + "]" + str + "[/" +tag+ "]";
sel.select();
return;
}
else if(typeof input.selectionStart != 'undefined'){
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);
input.value = input.value.substr(0, start) + '['+tag+']' + insText + '[/'+tag+']'+ input.value.substr(end);
input.focus();
input.setSelectionRange(start+2+tag.length+insText.length+3+tag.length,start+2+tag.length+insText.length+3+tag.length);
return;
}
else{
input.value+=' ['+tag+']Reemplace este texto[/'+tag+']';
return;
}
}
function inslink(){
var input = document.form1.contenido;
if(typeof document.selection != 'undefined' && document.selection) {
var str = document.selection.createRange().text;
input.focus();
var my_link = prompt("Enter URL:","http://");
if (my_link != null) {
if(str.length==0){
str=my_link;
}
var sel = document.selection.createRange();
sel.text = "[a href=\"" + my_link + "\"]" + str + "[/a]";
sel.select();
}
return;
}else if(typeof input.selectionStart != 'undefined'){
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);
var my_link = prompt("Enter URL:","http://");
if (my_link != null) {
if(insText.length==0){
insText=my_link;
}
input.value = input.value.substr(0, start) +"[a href=\"" + my_link +"\"]" + insText + "[/a]"+ input.value.substr(end);
input.focus();
input.setSelectionRange(start+11+my_link.length+insText.length+4,start+11+my_link.length+insText.length+4);
}
return;
}else{
var my_link = prompt("Ingresar URL:","http://");
var my_text = prompt("Ingresar el texto del link:","");
input.value+=" [a href=\"" + my_link + "\"]" + my_text + "[/a]";
return;
}
}
</script>
</head>

<body>
<form name="form1" method="post" action="">
<input type="button" name="Submit" value="B" onClick="instag('b')">
<input type="button" name="Submit3" value="U" onClick="instag('u')">
<input type="button" name="Submit4" value=" I " onClick="instag('i')">
<input type="button" name="Submit2" value="LINK" onClick="inslink()">
<br>
<textarea name="contenido" cols="40" rows="10" id="contenido"></textarea>

</form>
</body>
</html>
Y algo más completo, en este enlace: bebecode

paulkees 06/11/2006 14:00
Rotador de Banners que acepta swf, gif y texto.
 
P: ¿Cómo puedo realizar un rotador de banners que acepte swf, gif y texto?
R: Aqui tienes un script que funciona perfectamente!!!
Creditos: Realizado por Fabian Muller y modificado por "djreficul" y una pequeña ayuda de "paulkees" para ForosdelWeb.com

Código HTML:
<html> <head>  <title>Selección de Banners Aleatorios</title> </head> <body> <SCRIPT LANGUAGE="JavaScript"> // Realizado por: Fabian Muller y modificado por "djreficul" y una muy pequeña ayudita de "paulkees" de ForosdelWeb.com  // Comienzo var banners = 3; var ahora = new Date() var segundos = ahora.getSeconds() var ad = segundos % banners; ad +=1; if (ad==1) { flash="images/banners/240x74_anuncio.swf" width="295"; height="90"; } if (ad==2) { flash="images/bantrigoban.gif" width="289"; height="100"; url="http://www.rawk.com.ar"; txt="¡Conoce rawk.com.ar ahora!"; } if (ad==3) { flash="images/banners/foros_295x80.swf" width="295"; height="80"; } temp=flash.split("."); extension=temp[(temp.length-1)]; document.write('<center>'); if (extension=='swf') { 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('<a href=\"' + url + '\" target=\"_blank\">'); document.write ('<img src="'+flash+'" width="'+width+'" height="'+height+'" border="0">'); document.write('<center><small>' + txt + '</small></center></a>'); } document.write('</center>'); // Fin </SCRIPT> </body> </html>

caricatos 13/12/2006 03:57
Re: FAQs JavaScript
 
P: Como obtener el código de una letra (ASCII)
R: Con el método charCodeAt().

El método se aplica a elementos del tipo String (texto) y el parámetro que recibe es la posición del elemento.

Ejemplo:
"A".charCodeAt(0) = 65; (A)
"Hola".charCodeAt(3) = 97 (a)

El método inverso sería fromCharCode(), donde los parámetros son los códigos de los caracteres que se obtendrán.

Ejemplo:
String.fromCharCode(104, 111, 108, 97) = "hola"

:arriba:

caricatos 30/12/2006 17:38
Re: FAQs JavaScript
 
P: Como borrar un input file
R: Por seguridad los campos file no son editables, pero se puede reemplazar por uno nuevo con el DOM

ver ejemplo:

Código:
<html>
        <head>
                <title>
                        prueba
                </title>
                <script type="text/javascript">
                        function valida(f) {
                                if (f.value.substr(f.value.length - 3).toUpperCase() == "JPG")
                                        alert("Ok")
                                else        {
                                        alert("No");
                                        siguiente = f.nextSibling;
                                        fff = document.createElement("input");
                                        fff.type = "file";
                                        fff.name = f.name;
                                        fff.onchange = f.onchange;
                                        fff.value = "";
                                        f.form.insertBefore(fff, siguiente);
                                        f.form.removeChild(f);
                                }
                        }
                </script>
        </head>
        <body >
                <form action="" method="get" name="f">
                        <input type="file" name="jpg[0]" onChange="valida(this)"/>
                        <input type="file" name="jpg[1]" onChange="valida(this)"/>
                        <input type="file" name="jpg[2]" onChange="valida(this)"/>
                        <input type="file" name="jpg[3]" onChange="valida(this)"/>
                </form>
        </body>
</html>
Se ha tratado el tema en estos enlaces: ¿cómo pongo un campo file vacio desde javascript? y Vaciar un campo de formulario

:arriba:

tomax 03/01/2007 10:39
Re: FAQs JavaScript
 
A las varias FAQ sobre agregar reloj, agrego esta de mi cosecha: En la barra de direcciones:
Cita:
javascript:(function(){document.body.onmousemove=n ew Function("var d = new Date();var reloj=d.toLocaleString();this.title=reloj")})();
O en
Cita:
<body onmousemove="var d = new Date();var reloj=d.toLocaleString();this.title=reloj" >

derkenuke 31/01/2007 18:00
Re: FAQs JavaScript
 
P: ¿Cómo formateo un número con un separador de miles y uno de decimales? ¿Cómo vuelvo otra vez al formato original para operar?

R: He implementado unos cuantos métodos del objeto String para formatear un número con símbolos personalizados. format formatea y desFormat vuelve al estilo original.

Código:
<script language="Javascript">

String.prototype.reverse=function() { return this.split("").reverse().join(""); }
String.prototype.format=function(sepMil,sepDec) {
        var partes=this.split(".");                        //dividimos parte entera de decimal
        return partes[0].reverse().replace( /(\d{3})(?=\d)/g ,"$1"+sepMil).reverse() + (partes[1]?(sepDec + partes[1]):"");
}
String.prototype.desFormat=function(sepMil,sepDec) {
        var reMil=new RegExp("\\"+sepMil,"g");                //para localizar los sepMil
        var reDec=new RegExp("\\"+sepDec);                        //para localizar los sepDec
        return this.replace(reMil,"").replace(reDec,".").replace(/\s/g,"");
}

var numeros=[123.41, 1234.001, 123456.00, 123, 12345, 12345678901];


</script>

<table border="1">
        <script language="JavaScript">
        for(var a in numeros) {
                var n=numeros[a].toString();
                var fn=n.format(".","'");
                var dfn=fn.desFormat(".","'");
                document.writeln("<tr><td>" + n + "</td><td>" + fn + "</td><td>" + dfn + "</td></tr>");
        }
        </script>
</table>
Recordad que son métodos para String, ¡habremos de convetir los números a String con toString()!

derkenuke 31/01/2007 19:08
Re: FAQs JavaScript
 
P: ¿Cómo formateo "al vuelo" mientras el usuario escribe en su caja de texto?

R:

Código:
<script language="Javascript">

String.prototype.reverse=function() { return this.split("").reverse().join(""); }
String.prototype.format=function(sepMil,sepDec) {
        var partes=this.split(".");                        //dividimos parte entera de decimal
        return partes[0].reverse().replace( /(\d{3})(?=\d)/g ,"$1"+sepMil).reverse() + (partes[1]?(sepDec + partes[1]):"");
}
String.prototype.desFormat=function(sepMil,sepDec) {
        var reMil=new RegExp("\\"+sepMil,"g");                //para localizar los sepMil
        var reDec=new RegExp("\\"+sepDec);                        //para localizar los sepDec
        return this.replace(reMil,"").replace(reDec,".").replace(/\s/g,"");
}

//escogemos los separadores que queramos
var SEPMIL=".";
var SEPDEC="'";
document.write("Utiliza un "+SEPDEC+" como separador de decimales.<br/>");

</script>

<input type="text" onkeyup="handler(event,this)" />

<script language="javascript">

function handler(e,caja) {
        //obtener la tecla pulsada
        var code = (window.Event) ? e.which : e.keyCode;
    var tecla = String.fromCharCode(code);
        if(caja.value.lastIndexOf(SEPDEC)==caja.value.length-1)                //se ha escrito SEPDEC, dejar empezar a escribir decimales
                return;               
        else if( "1234567890".indexOf(tecla)>-1) {                                        //se ha escrito un numero
                caja.value=caja.value.desFormat(SEPMIL,SEPDEC).format(SEPMIL,SEPDEC);
                return;
        }
}
</script>


La zona horaria es GMT -6. Ahora son las 23:44.
Página 5 de 6 1234 5 6
Mostrar 50 mensajes desde este tema en una página

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2025, Jelsoft Enterprises Ltd.