Foros del Web
Página 9 de 14 « Primero 345678 9 1011121314
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/)

ACHAVARRIA 07/11/2003 09:04
163.- Efecto: Estela en el puntero del mouse
 
P: ¿Como dejar una Estela en el puntero del mouse?

R: Copia el siguiente script entre las etiquetas <body> y </body>:

Código PHP:
<script language="JavaScript">
<!-- Mouse Comet II script by [email]kurt.grigg@virgin.net[/email]
colours=new Array('#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF')
n = 10;
y = 0;
x = 0;
n6=(document.getElementById&&!document.all);
ns=(document.layers);
ie=(document.all);
d=(ns||ie)?'document.':'document.getElementById("';
a=(ns||n6)?'':'all.';
n6r=(n6)?'")':'';
s=(ns)?'':'.style';
if (ns){
for (i = 0; i < n; i++)
document.write('<layer name="dots'+i+'" top=0 left=0 width='+i/2+' height='+i/2+' bgcolor=#ff0000></layer>');
}
if (ie)
document.write('<div id="con" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
if (ie||n6){
for (i = 0; i < n; i++)
document.write('<div id="dots'+i+'" style="position:absolute;top:0px;left:0px;width:'+i/2+'px;height:'+i/2+'px;background:#ff0000;font-size:'+i/2+'"></div>');
}
if (ie)
document.write('</div></div>');
(ns||n6)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
y = (ns||n6)?evnt.pageY+4 - window.pageYOffset:event.y+4;
x = (ns||n6)?evnt.pageX+1:event.x+1;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
function animate(){
o=(ns||n6)?window.pageYOffset:0;
if (ie)con.style.top=document.body.scrollTop;
for (i = 0; i < n; i++){
var temp1 = eval(d+a+"dots"+i+n6r+s);

randcolours = colours[Math.floor(Math.random()*colours.length)];
(ns)?temp1.bgColor = randcolours:temp1.background = randcolours; 
if (i < n-1){
var temp2 = eval(d+a+"dots"+(i+1)+n6r+s);
temp1.top = parseInt(temp2.top);
temp1.left = parseInt(temp2.left);
} 
else{
temp1.top = y+o;
temp1.left = x;
}
}
setTimeout("animate()",10);
}
animate();
// -->
</script> 
Dentro del vector colours se almacenan los colores de las diferentes posiciones de la estela, los cuales pueden ser modificados a gusto propio.

Código PHP:
colours=new Array('#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF','#6699FF') 

ACHAVARRIA 07/11/2003 09:06
164.- Barra de "cargando página"
 
P: ¿Como puedo poner una barra que me indique que la página esta siendo cargada?

R: Para hacerlo, debemos incorporar el siguiente código dentro de las etiquetas <head> y </head>:

Código PHP:
<html>
<head>
<title>Título</title>
<div ID="waitDiv" style="position:absolute;left:300;top:300;visibility:hidden">
<table cellpadding="6" cellspacing="0" border="1" bgcolor="#000000" bordercolor="#FFFFFF">
<tr><td align=center>
<font color="#ffffff" face="Verdana" size="4">Cargando página...</font>
<img src="/images/cargando.gif" border="1">
</td>
</tr></table>
</div>
<SCRIPT>
<!--
var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) {
if (document.getElementById)
{ return document.getElementById(name).style; }
else if (document.all)
{ return document.all[name].style; }
else if (document.layers)
{ return document.layers[name]; }
}
function ap_showWaitMessage(div,flag) {
if (!DHTML) return;
var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage('waitDiv', 3);
//-->
</SCRIPT>
</head>
<body>
Cuerpo del sitio
</body>
<SCRIPT language=javascript>
<!-- 
ap_showWaitMessage('waitDiv', 0); 
//-->
</SCRIPT>
</html> 

ACHAVARRIA 07/11/2003 09:11
165.- Proteger páginas con password
 
P: ¿Existe alguna forma de implementar passwords con JavaScript?

R: Con el lenguaje JavaScript no es posible hacer grandes sistemas de protección de páginas con password. Pero existe un método que a más de uno les puede ser útil.

Se trata de ubicar un formulario en el que se pide un password, al ingresarlo y clickear sobre "Enviar", este toma el valor del campo y se dirige a una página con datos_del_campo.htm. Es decir, para poder ingresar a la página oculta debemos tipear dentro del formulario
datos_del_campo.

Obviamente la página que no queremos proteger vamos a ponerle un nombre más difícil, lleno de números, como por ejemplo: 77xwt1.htm. En este caso, para poder ingresar, se debe tipear dentro del campo del formulario la palabra 77xwt1 y el javascript redireccionará hacia el .htm. Si la clave que se ingresó no es la correcta se mostrará la típica página de error 404.

Código fuente
El código que hará posible la protección que javascript es el siguiente:

Código PHP:
<SCRIPT>
function acceso(){
window.location = document.formclave.clave.value +
".htm"
}
</SCRIPT>
<FORM name=formclave>
<INPUT type=text name=clave>
<INPUT type=button value=Enviar onclick="acceso()">
</FORM> 
La página oculta (la que queremos proteger) se puede como uno la desee, no influye en el anterior código. El formulario posee un campo y un botón que al clickearlo llama a la función acceso(). Al ejecutarse esta función, se encarga de tomar el contenido del campo clave y asigna al navegador que se dirija hacia una página con el contenido de ese campo + la extensión .htm.

ACHAVARRIA 07/11/2003 09:13
166.- Efecto: "terremoto" en el navegador
 
P: ¿Como puedo hacer con JavaScript un efecto de "terremoto"?

R: No sé si este efecto sea útil, pero puede resultar algo divertido. Se trata de un JavaScript que tiene como función realizar un efecto de "terremoto" o "sacudir" la ventana del navegador.

El siguiente script lo ubicamos dentro del cuerpo de la página (entre los tags <body> y </body>)

Código PHP:
<SCRIPT LANGUAGE="JavaScript1.2">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! [url]http://javascript.internet.com[/url] -->
function shake_xy(n) {
if (self.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.moveBy(0,i);
self.moveBy(i,0);
self.moveBy(0,-i);
self.moveBy(-i,0);
}
}
}
}

function shake_x(n) {
if (self.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.moveBy(i,0);
self.moveBy(-i,0);
}
}
}
}

function shake_y(n) {
if (self.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.moveBy(0,i);
self.moveBy(0,-i);
}
}
}
}

//-->
</SCRIPT> 
Y luego realizamos un link a la función:

Código PHP:
<a href="javascript:shake_xy(3)">Sacudir pantalla</a> 
Sacudir pantalla

O con un botón:

Código PHP:
<input type=button value="Sacudir pantalla" onclick="shake_x(4)"> 

ACHAVARRIA 07/11/2003 09:16
167.- Abrir una ventana cuando otra es cerrada
 
P: ¿Como puedo abrir una ventana cuando otra se cierra?

R: Con el script que mostraremos a continuación podemos abrir una ventana nueva cuando otra es cerrada. Lo bueno que tiene es que se puede configurar la cantidad de segundos que se debe esperar antes de abrir la nueva ventana.

Código fuente

Código PHP:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- Comienzo
closetime = 0; // Cantidad de segundos a esperar para abrir la ventana nueva
function Start(URL, WIDTH, HEIGHT) {
windowprops = "left=50,top=50,width=" + WIDTH + ",height=" + HEIGHT;
preview = window.open(URL, "preview", windowprops);
if (closetime) setTimeout("preview.close();", closetime*1000);
}
function doPopup() {
url = "popup.htm";
width = 400; // ancho en pixels
height = 320; // alto en pixels
delay = 2; // tiempo de delay en segundos
timer = setTimeout("Start(url, width, height)", delay*1000);
}
// Fin -->
</script>
</head>
<body UnOnLoad="doPopup();">
<b>Contenido de tu sitio...</b>
</body>
</html> 

JavierB 14/11/2003 14:54
168 .- Validar una IP
 
P: Como puedo validar que una IP sea correcta.

R: Con estas pocas líneas de código:
Código PHP:
function validar(ip) {
    partes=ip.split('.');
    if (partes.length!=4) {
        alert('ip no valida');
        return;
    }
    for (i=0;i<4;i++) { 
        num=partes[i];
        if (num>255 || num<0 || num.length==0 || isNaN(num)){
        alert('ip no valida');
        return;
        }
        }
} 
Agradezco a ElAprendiz que he haya recordado que también hay que validar que no se introduzcan caracteres no numéricos.

Kaopectate 20/11/2003 06:41
169.- Combos encadenados para armar con Bases de datos
 
P: ¿Como puedo poner en mi página dos combos que dependiendo de la opción seleccionada en uno de ellos me cambie el contenido del otro combo, teniendo en cuenta de que todas las opciones provienen de una base de datos?

R:

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

   /* Trae desde la base de datos los nombres de los paises */
   /* y colócalos en este arreglo.                          */
   var aPaises = new Array(
                           " ",
                           "Mexico",
                           "España",
                           "Venezuela"
                          );

   var aEstados0 = new Array(
                           " "
                          );

   /* Trae desde la base de datos los nombres de las ciudades */
   /* de cada uno de los paises de la lista anterior y ponlos */
   /* en arreglos individuales.                               */
   var aEstados1 = new Array(
                           " ",
                           "Ciudad de México",
                           "Monterrey",
                           "Guadalajara"
                          );

   var aEstados2 = new Array(
                           " ",
                           "Madrid",
                           "Barcelona",
                           "San Sebastián"
                          );

   var aEstados3 = new Array(
                           " ",
                           "Caracas",
                           "Coro",
                           "Maracay",
                           "Valencia"
                          );

   /* Arma un arreglo general de estados a partir de los arreglos  */
   /* anteriores. Es importante que cada arreglo comience por un   */
   /* valor en blanco y que el primer arreglo de ciudades, llamado */
   /* aqui aEstados0, no contenga ningún elemento.                 */
   var aEstados = new Array(
                          aEstados0,
                          aEstados1,
                          aEstados2,
                          aEstados3
                          );

   function opcion(oCntrl, iPos, sTxt, sVal){
     var selOpcion=new Option(sTxt, sVal);
     eval(oCntrl.options[iPos]=selOpcion);
   }

   function cambia(oMster, oCntrl){
    var nSelected = oMster.selectedIndex;
    while (oCntrl.length) oCntrl.remove(0);
    for(var i = 0; i < aEstados[nSelected].length; i++)
     opcion(oCntrl,  i, aEstados[nSelected][i], String(i));
   }

   function llena(oCntrl){
    while (oCntrl.length) oCntrl.remove(0);
    for(var i = 0; i < aPaises.length; i++)
     opcion(oCntrl,  i, aPaises[i], String(i));
   }

  </script>
 </head>
 <body>
  <form name="frm">
   Pais
   <select name="pais" onchange="cambia(this, document.frm.ciudad)">
    <option value=" ">&nbsp;</option>
   </select>
   &nbsp;&nbsp;&nbsp;
   Ciudad
   <select name="ciudad">
    <option value=" ">&nbsp;</option>
   </select>
  </form>
  <script language="JavaScript">
   llena(document.frm.pais);
  </script>
 </body>
</html> 

derkenuke 24/12/2003 20:37
170.- Contraseñas seguras en javascript
 
P: ¿Como puedo hacer una contraseña segura para mi web?

R: Existe un metodo inventado, se llama md5, y convierte una cadena (por muy larga que sea) a una nueva codificada de codigo hexadecimal de una determinada longitud. Lo bueno es que dos cadenas iguales generan la misma codificacion y no existen (o eso dicen xD) dos cadenas diferentes que se codifiquen igual. El codigo para ocultar claves os lo dejo, hacer lo que querais con él.



Código PHP:
// ******************************************************************************
// * md5.js
// *
// * A JavaScript implementation derived from the RSA Data Security, Inc. MD5
// * Message-Digest Algorithm. See [url]http://cw.oaktree.co.uk/site/legal.html[/url] for
// * details.
// *
// * Copyright (C) Paul Johnston 1999 - 2000. Distributed under the LGPL.
// *****************************************************************************/

/* to convert strings to a list of ascii values */
var sAscii = " !\"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ"
var sAscii = sAscii + "[\\]^_`abcdefghijklmnopqrstuvwxyz{|}~";

/* convert integer to hex string */
var sHex = "0123456789ABCDEF";
function hex(i)
{
  h = "";
  for(j = 0; j <= 3; j++)
  {
    h += sHex.charAt((i >> (j * 8 + 4)) & 0x0F) +
         sHex.charAt((i >> (j * 8)) & 0x0F);
  }
  return h;
}

/* add, handling overflows correctly */
function add(x, y)
{
  return ((x&0x7FFFFFFF) + (y&0x7FFFFFFF)) ^ (x&0x80000000) ^ (y&0x80000000);
}

/* MD5 rounds functions */
function R1(A, B, C, D, X, S, T)
{
  q = add(add(A, (B & C) | ((~B) & D)), add(X, T));
  return add((q << S) | (q >>> (32 - S)), B);
}

function R2(A, B, C, D, X, S, T)
{
  q = add(add(A, (B & D) | (C & (~D))), add(X, T));
  return add((q << S) | (q >>> (32 - S)), B);
}

function R3(A, B, C, D, X, S, T)
{
  q = add(add(A, B ^ C ^ D), add(X, T));
  return add((q << S) | (q >>> (32 - S)), B);
}

function R4(A, B, C, D, X, S, T)
{
  q = add(add(A, C ^ (B | (~D))), add(X, T));
  return add((q << S) | (q >>> (32 - S)), B);
}

/* main entry point */
function calcMD5(sInp) {

  /* Calculate length in machine words, including padding */
  wLen = (((sInp.length + 8) >> 6) + 1) << 4;
  var X = new Array(wLen);

  /* Convert string to array of words */
  j = 4;
  for (i = 0; (i * 4) < sInp.length; i++)
  {
    X[i] = 0;
    for (j = 0; (j < 4) && ((j + i * 4) < sInp.length); j++)
    {
      X[i] += (sAscii.indexOf(sInp.charAt((i * 4) + j)) + 32) << (j * 8);
    }
  }

  /* Append padding bits and length */
  if (j == 4)
  {
    X[i++] = 0x80;
  }
  else
  {
    X[i - 1] += 0x80 << (j * 8);
  }
  for(; i < wLen; i++) { X[i] = 0; }
  X[wLen - 2] = sInp.length * 8;

  /* hard coded initial values */
  a = 0x67452301;
  b = 0xefcdab89;
  c = 0x98badcfe;
  d = 0x10325476;

  /* Process each 16 word block in turn */
  for (i = 0; i < wLen; i += 16) {
    aO = a;
    bO = b;
    cO = c;
    dO = d;

    a = R1(a, b, c, d, X[i+ 0], 7 , 0xd76aa478);
    d = R1(d, a, b, c, X[i+ 1], 12, 0xe8c7b756);
    c = R1(c, d, a, b, X[i+ 2], 17, 0x242070db);
    b = R1(b, c, d, a, X[i+ 3], 22, 0xc1bdceee);
    a = R1(a, b, c, d, X[i+ 4], 7 , 0xf57c0faf);
    d = R1(d, a, b, c, X[i+ 5], 12, 0x4787c62a);
    c = R1(c, d, a, b, X[i+ 6], 17, 0xa8304613);
    b = R1(b, c, d, a, X[i+ 7], 22, 0xfd469501);
    a = R1(a, b, c, d, X[i+ 8], 7 , 0x698098d8);
    d = R1(d, a, b, c, X[i+ 9], 12, 0x8b44f7af);
    c = R1(c, d, a, b, X[i+10], 17, 0xffff5bb1);
    b = R1(b, c, d, a, X[i+11], 22, 0x895cd7be);
    a = R1(a, b, c, d, X[i+12], 7 , 0x6b901122);
    d = R1(d, a, b, c, X[i+13], 12, 0xfd987193);
    c = R1(c, d, a, b, X[i+14], 17, 0xa679438e);
    b = R1(b, c, d, a, X[i+15], 22, 0x49b40821);

    a = R2(a, b, c, d, X[i+ 1], 5 , 0xf61e2562);
    d = R2(d, a, b, c, X[i+ 6], 9 , 0xc040b340);
    c = R2(c, d, a, b, X[i+11], 14, 0x265e5a51);
    b = R2(b, c, d, a, X[i+ 0], 20, 0xe9b6c7aa);
    a = R2(a, b, c, d, X[i+ 5], 5 , 0xd62f105d);
    d = R2(d, a, b, c, X[i+10], 9 ,  0x2441453);
    c = R2(c, d, a, b, X[i+15], 14, 0xd8a1e681);
    b = R2(b, c, d, a, X[i+ 4], 20, 0xe7d3fbc8);
    a = R2(a, b, c, d, X[i+ 9], 5 , 0x21e1cde6);
    d = R2(d, a, b, c, X[i+14], 9 , 0xc33707d6);
    c = R2(c, d, a, b, X[i+ 3], 14, 0xf4d50d87);
    b = R2(b, c, d, a, X[i+ 8], 20, 0x455a14ed);
    a = R2(a, b, c, d, X[i+13], 5 , 0xa9e3e905);
    d = R2(d, a, b, c, X[i+ 2], 9 , 0xfcefa3f8);
    c = R2(c, d, a, b, X[i+ 7], 14, 0x676f02d9);
    b = R2(b, c, d, a, X[i+12], 20, 0x8d2a4c8a);

    a = R3(a, b, c, d, X[i+ 5], 4 , 0xfffa3942);
    d = R3(d, a, b, c, X[i+ 8], 11, 0x8771f681);
    c = R3(c, d, a, b, X[i+11], 16, 0x6d9d6122);
    b = R3(b, c, d, a, X[i+14], 23, 0xfde5380c);
    a = R3(a, b, c, d, X[i+ 1], 4 , 0xa4beea44);
    d = R3(d, a, b, c, X[i+ 4], 11, 0x4bdecfa9);
    c = R3(c, d, a, b, X[i+ 7], 16, 0xf6bb4b60);
    b = R3(b, c, d, a, X[i+10], 23, 0xbebfbc70);
    a = R3(a, b, c, d, X[i+13], 4 , 0x289b7ec6);
    d = R3(d, a, b, c, X[i+ 0], 11, 0xeaa127fa);
    c = R3(c, d, a, b, X[i+ 3], 16, 0xd4ef3085);
    b = R3(b, c, d, a, X[i+ 6], 23,  0x4881d05);
    a = R3(a, b, c, d, X[i+ 9], 4 , 0xd9d4d039);
    d = R3(d, a, b, c, X[i+12], 11, 0xe6db99e5);
    c = R3(c, d, a, b, X[i+15], 16, 0x1fa27cf8);
    b = R3(b, c, d, a, X[i+ 2], 23, 0xc4ac5665);

    a = R4(a, b, c, d, X[i+ 0], 6 , 0xf4292244);
    d = R4(d, a, b, c, X[i+ 7], 10, 0x432aff97);
    c = R4(c, d, a, b, X[i+14], 15, 0xab9423a7);
    b = R4(b, c, d, a, X[i+ 5], 21, 0xfc93a039);
    a = R4(a, b, c, d, X[i+12], 6 , 0x655b59c3);
    d = R4(d, a, b, c, X[i+ 3], 10, 0x8f0ccc92);
    c = R4(c, d, a, b, X[i+10], 15, 0xffeff47d);
    b = R4(b, c, d, a, X[i+ 1], 21, 0x85845dd1);
    a = R4(a, b, c, d, X[i+ 8], 6 , 0x6fa87e4f);
    d = R4(d, a, b, c, X[i+15], 10, 0xfe2ce6e0);
    c = R4(c, d, a, b, X[i+ 6], 15, 0xa3014314);
    b = R4(b, c, d, a, X[i+13], 21, 0x4e0811a1);
    a = R4(a, b, c, d, X[i+ 4], 6 , 0xf7537e82);
    d = R4(d, a, b, c, X[i+11], 10, 0xbd3af235);
    c = R4(c, d, a, b, X[i+ 2], 15, 0x2ad7d2bb);
    b = R4(b, c, d, a, X[i+ 9], 21, 0xeb86d391);

    a = add(a, aO);
    b = add(b, bO);
    c = add(c, cO);
    d = add(d, dO);
  }
  return hex(a) + hex(b) + hex(c) + hex(d);
} 

derkenuke 04/01/2004 18:26
171.- Desordenar array logicamente aunque parezca ilogico
 
P: ¿Como puedo desordenar un array dos veces "aleatoriamente" y que el resultado sea el mismo?

R: He ideado un metodo a partir del conocido quickSort, sin evaluar si un elemento es menor que otro o demas, simplemente los cambia sean como sean:

Código PHP:
function desorden(arr) {    //solo para desordenar mucho
    for(a=1;a<=arr.length-1;a++) quickDeSort(arr,0,a);
    for(a=0;a<arr.length-1;a++) quickDeSort(arr,a,arr.length-1);
}
function quickDeSort(objArray,ini,fin) { 
    var i=ini; var j=fin; var tmp;
    do { 
        tmp = objArray[i];
        objArray[i] = objArray[j];
        objArray[j] = tmp; 
        if ( i <= j ) { i++; j--; }
    } while ( i <= j );
    if ( ini < j ) quickDeSort(objArray,ini,j);
    if ( i < fin ) quickDeSort(objArray,i,fin); 
} 
Es curioso que si llamamos a quickDeSort con los mismos atributos dos veces (lo he probado solo con 0 y objArray.length-1), el array queda intacto. Por muchas veces que hagais reload, el desorden quedara igual y parecera aleatorio. La function desorden solo sirve para desordenar muchas veces, y darle mas realismo.

Espero que les sirva.

epa2 07/01/2004 06:22
172.- Menú de salto con la opción de abrirlo en una nueva ventana

Créditos: Bravenet

Código:
<html>
<head>
<script language="javascript">
<!--
function skip(){
var tickit=document.optionform
if (tickit.chooseit.checked){
if (!window.newwindow)
newwindow=window.open("")
newwindow.location=tickit.test.options[tickit.test.selectedIndex].value
}
else
location=tickit.test.options[tickit.test.selectedIndex].value
}
//-->
</script>
</head>

<body>
<form name="optionform">
<select  name="test" size=1 style="font:bold 11px verdana;background-color:#DAE6F8;color:#000000;">
    <option value="http://www.epa2.com">Epa2</option>
    <option value="http://www.terra.es">Hola amigos</option>
    <option value="http://www.mp3.com">Adiós amigos</option>
        <option value="http://www.caricatos.com">Saludos a los señores del anillo de los foros</option>
  </select><br>
  <input type="checkbox" name="chooseit" value="ON"><span  style="font:11px verdana;">Abrir en nueva ventana pecador.</span><br>
  <input type="button" value="Vamos a por ellos" onClick="skip()" style="font:bold 11px verdana;background-color:#DAE6F8;color:#cc0000;"></form>
</body>
</html>

epa2 20/01/2004 05:23
173.- Pequeño álbum de fotos

Creditos: Bravenet

Nota: Aún sigo vivo amigos¡¡¡¡¡ Me cuesta trabajo luchar contra la abduzión ;-)

Para este script ten en cuenta lo siguiente:

Si vas a emplear más de 3 imágenes, cambia la siguiente línea...
if (document.images && thisImage < 2)
por el número de imagenes que vayas a usar

Código:


<script language="JavaScript">
<!--
var viewPix = new Array("http://www.tusitio.com/tuimagen.png","http://www.tusitio.com/tuimagen2.png","http://www.tusitio.com/tuimagen3.png")

var thisImage = 0

function doPast() {
if (document.images && thisImage > 0) {
thisImage--
document.myShow.src=viewPix[thisImage]
}
}
function doAfter() {
if (document.images && thisImage < 2) {
thisImage++
document.myShow.src=viewPix[thisImage]
}
}
// -->
</script>
<div align="center"><img name="myShow" src="http://www.tusitio.com/tuimagen.png" width="468" height="60"><br><a href="javascript:doPast()">Anterior</a>    <a href="javascript:doAfter()">Siguiente</a></div>

Espero que nos veamos pronto
Salu2 :adios:

jabakero 29/01/2004 19:27
174.- Abrir un pop-up y cerrar la ventana a la vez
 
Como abrir un pop-up y cerrar la ventana a la vez

Bien, creo que esto falta entre las FAQ's...

La he probado y me sirve bien :)

Código PHP:
<html>
<head>
<title>Launcher</title>
<script language="javascript">
function launch(){
x=window.open("previewforo.htm","WindowName","width=900,height=600,top=0,left=0,resizable=yes,scrollbars=yes,menubar=yes,toolbar=yes,status=yes,location=yes")
var ventana = window.self;
    ventana.opener = window.self;
    ventana.close();
}

</script>
<body>
<p><a href="javascript:launch()">Click aqui.</a></p>
</body>
</html> 

Carlitos 08/03/2004 12:51
175.- Validar Hora

P.- Quiero un script que me valide la hora

R.- Aquí lo tienes.

Versión 1.
Código:
<script>
// script para validar una hora en formato 24h. Por Carlitos ([email protected])//
function valida(str)
{
hora=str.value
if (hora.length!=4) {alert("introducir HHMM");return}
a=hora.charAt(0)
b=hora.charAt(1)
c=hora.charAt(2)
if (a>=2 && b>3) {alert("hora mal :(");return}
if (c>5) {alert("minutos mal :(");return}
alert("hora bien. :)")
}
</script>
Hora (HHMM):<input type="text" name="hhmm" size="4">
<input type="button" value="Valida" onclick="valida(hhmm)">
Versión 2. (Modificación de la versión 1 por AnaLezama)
Código:
<script language="JavaScript">
// Por AnaLezama
function CheckTime(str)
{
hora=str.value
if (hora=='') {return}
if (hora.length>8) {alert("Introdujo una cadena mayor a 8 caracteres");return}
if (hora.length!=8) {alert("Introducir HH:MM:SS");return}
a=hora.charAt(0) //<=2
b=hora.charAt(1) //<4
c=hora.charAt(2) //:
d=hora.charAt(3) //<=5
e=hora.charAt(5) //:
f=hora.charAt(6) //<=5
if ((a==2 && b>3) || (a>2)) {alert("El valor que introdujo en la Hora no corresponde, introduzca un digito entre 00 y 23");return}
if (d>5) {alert("El valor que introdujo en los minutos no corresponde, introduzca un digito entre 00 y 59");return}
if (f>5) {alert("El valor que introdujo en los segundos no corresponde");return}
if (c!=':' || e!=':') {alert("Introduzca el caracter ':' para separar la hora, los minutos y los segundos");return}
  </script>
}
<input type=text name=txtHora onBlur="CheckTime(this)" size=12 maxlength=10>
Puedes consultar este mensaje para más información.

Carlitos 13/03/2004 05:59
176.- Texto vertical

P.-Quiero poner un texto en vertical. ¿Cómo lo hago?

R.- Utilizando este código:
Código:
<script Language="JavaScript">
/*******************************
 Texto vertical. Por Carlitos. [email protected]
 Si usas este script, deja intactas estas líneas (créditos). Vale?
 También te agradecería un e-mail con tus comentarios.
*******************************/

function escribe(msg)
{
cont =0;
    while (cont<msg.length)
    {
      letra = msg.substring(cont,cont+1)
      document.write(letra+"<br>")
      cont+=1
    }
}
</script>
</head>
Y cuando queramos colocar un texto vertical en cualquier parte de nuestra página, llamaremos a la rutina así:
Código:
<script>escribe("hola caracola")</script>
Otra forma de poner texto vertical, se encuentra en la faq 33 de html.

caricatos 18/03/2004 01:24
177 - Submit a una ventana emergente (popup)

P. Quiero que un submit del form se muestre en una ventana emergente.

R. Hay que poner el target del form con un nombre para la ventana emergente y abrir esa ventana en el evento onsubmit... :pensando:

Ejemplo:

<form name="formulario" action="destino.php" target="ventanaForm" onsubmit="window.open('', 'ventanaForm', '')" method="post" >
...

Saludos :arriba:

Nota adicional:

Si se quiere enviar el formulario sin usar un botón submit (mediante la función submit() del formulario) debe abrirse la ventana antes (no serviría en tal caso el evento onsubmit)

function enviar() {
window.open("", "ventanaForm", "");
document.forms["formulario"].submit();
}

Modificado por ser sugerido en este mensaje: http://www.forosdelweb.com/f13/definir-tamano-ventana-form-con-target-_blank-319283/

:adios:

JavierB 24/03/2004 11:04
178.- Imprimir una parte de la página
 
P: ¿Como puedo imprimir solo la parte de la página que me interesa?

R: La idea es "ocultar", con css, los <div> donde pondremos, por ejemplo, las noticias y los enlaces que se utilizarán para imprimirlas. En el momento de imprimir se "hace visible" el <div> correspondiente.

He aquí un ejemplo:
Código PHP:
<html>
<head>
<style type="text/css">
@media print {
    div,a {display:none}
    .ver {display:block}
    .nover {display:none}
}
</style>
<script>
function impre(num) {
    document.getElementById(num).className="ver";
    print();
    document.getElementById(num).className="nover";
}
</script>
</head>

<body>
<div id="uno">
Artículo primero
</div>
<a href="#" onclick="impre('uno');return false">Imprime 1</a>
<div id="dos">
Artículo segundo
</div>
<a href="#" onclick="impre('dos');return false">Imprime 2</a>
<div id="tres">
Articulo tercero
</div>
<a href="#" onclick="impre('tres');return false">Imprime 3</a>
</body>
</html> 

caricatos 28/03/2004 16:16
179.- Precarga con barra de progreso
 
P: ¿Como hacer una precarga viendo el porcentaje de carga?

R: Para llevar el control de las imágenes que se cargan en memoria existe la propiedad "complete" que indica si están completamente cargadas.
Estas tres funciones sirven para ese control:

Código PHP:
function precargar()    {
    var dibujos = new Array(precargar.arguments.length);
    for (var i = 0; i < dibujos.length; i ++)    {
        dibujos[i] = new Image();
        dibujos[i].src = precargar.arguments[i]
    }
    return dibujos;
}

function precargados(dibujos)    {
    var parciales = true;
    for (var i = 0; i < dibujos.length; i ++)
        parciales = (parciales && dibujos[i].complete);
    return parciales;
}

function porciento(dibujos)    {
    var parciales = 0;
    for (var i = 0; i < dibujos.length; i ++)
        parciales += (dibujos[i].complete) ? 1 : 0;
    return parseInt(100 * parciales / dibujos.length);
} 
La idea es hacer un chequeo del estado de carga (precargados) y mostrar el porcentaje (porciento) que es fácilmente aplicable al estilo "width" de una capa. Por ejemplo:

Código PHP:
var imagenes;
function continuar()    {
    alert("Ok.");
}

function cargando()    {
    document.getElementById("estado").style.width = porciento(imagenes) + "%";
    if (precargados(imagenes))
        continuar();
    else
        setTimeout("cargando()", 100);
}

function ini()    {
    imagenes = new precargar("img0.jpg",
        "img1.jpg",
        "img2.jpg",
        "img3.jpg",
        "img4.jpg",
        "img5.jpg",
        "img6.jpg",
        "img7.jpg",
        "img8.jpg"
    );
    cargando();
} 
Donde pone continuar(), puede cambiarse el alert por cualquier otra cosa como por ejemplo una activación de un botón o un efecto rollover.

Y el código de la página tendría que tener un elemento con id="estado" para mostrar el porcentaje :pensando:
Por ejemplo:

<div style="position:relative; width: 100px; height: 20px; border: 1px" >
<div style="position:absolute; top: 0; left: 0; width:100%; height: 100%; background-color: blue" >
</div>
<div id="estado"
style="position:absolute; top: 0; left: 0; width: 1%; height: 100%; background-color: aqua" >
</div>
</div>

Se activaría con un evento como la carga de la página:
<body onload="ini()">

T4X 24/04/2004 23:25
180.- Dialogo Web (popUp sin menus contextuales )
 
P: Cómo abrir una ventana popUp sin menus contextuales ó mejor un Dialogo Web???????

R:

Bien, lo que tenemos que tener en cuenta es que el dialogo web maneja dos tipos de ventana:

showModalDialog: Permite solo interactuar con la ventana abierta, o sea, que si querés regresar a la ventana que la abrió tienes que cerrar este dialogo web.

showModelessDialog: Permite interactuar con las 2 ventanas (con la que la abriste y la abierta).

Lo anterior lo resalto para que cuando crees uno ten en cuenta que a tu gusto puedes hacer una interacción con el usuario.


Bien, en marcha, este es el argumento simple para crear una ventana modal (showmodalDialog):

Código:
<script language="javascript">
 
function abrirDialogoModal() {
showModalDialog('pagina.htm','','dialogWidth:505px; dialogHeight:325px;status:no;resizable:yes');
}
</script>
Como puedes ver, lo que estoy diciendo en el código anterior es que abra una ventana modal con parametros (ancho, alto y si prefieres Barra de Estado), y lo resaltado en rojo en el script son los parametros de ancho y alto que le quieras dar a la ventana...

Ahora, lo mismo puedes hacer con showModelessDialog:

Código:
<script language="javascript">
 
function abrirDialogoModeless() {
showModelessDialog('pagina.htm','','status:no;resizable:yes');
}
</script>
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.

Adicionalmente, en el Dialogo Web, se crean otros botones, si los quieres colocar o no:

help = Icono de ayuda
maximize = Icono de maximizar y de restaurar
minimize = Icono de minimizar

Si estos iconos los quieres colocar en tu ventana simplemente los colocarías asi:

Código:
showModalDialog('pagina.htm','','status:no;help:yes ó no;otros parametros');
He aqui un ejemplo para cargar una ventana web

Ver ejemplo

caricatos 29/04/2004 16:14
181.- Insertar emoticones en un textarea
 
P: ¿Como insertar emoticones en un textarea?

R: Voy a intentar repetir este mensaje porque he visto que se fué :pensando:

Para añadir texto en un textarea simple basta con hacer una función así:

function poner(este_texto) {
el_textarea.value += este_texto;
}

... luego los botones o los elementos activos para insertar emoticones (pueden ser los mismos emoticones) tendrían que tener asociada la función poner con el emoticón adecuado:
<input type=button onclick="poner('; - )')" value="; - )" />

Por último hay que convertir cada ocurrencia del emoticón con la imagen asociada (toda la etiqueta)
el_texto = el_textarea.value.split("; - )").join("<img src=smyle.gif />");

El método split convierte la cadena que lo usa en un array donde se separan los elementos por el parámetro que se pasa... luego join vuelve a generar la cadena, usando el parámetro como nexo.

P.D: Suopngo que no habrá mucha diferencia con la FAQ original.

:adios:

ludovico2000 10/05/2004 11:00
182.- Pasar varios parámetros a una misma función
 
P: ¿Cómo puedo utilizar una misma función para diferentes acciones que utilice varios parámetros?

R:

En este ejemplo queremos hacer que sobre diferentes áreas de mapa en una imagen apunten a diferentes vínculos que abran una ventana que en cada caso tiene un tamaño determinado.

Para ello, utilizamos una sola función:


<SCRIPT LANGUAGE="Javascript">
function abrir(pag,alto,ancho)
{
window.open(pag + ".htm","","height=" + alto +","+ "width=" + ancho);
};
</SCRIPT>

y en las zonas activas pondremos:

onClick="javascript:abrir('primera',540,400)"
onClick="javascript:abrir('segunda',20,100)"


La zona horaria es GMT -6. Ahora son las 16:46.
Página 9 de 14 « Primero 345678 9 1011121314
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.