Foros del Web » Programación web » Javascript »

FAQs JavaScript

Estas en el tema de FAQs JavaScript en el foro de Javascript en Foros del Web. P: Cómo cerrar una ventana del explorador confirmando si desea cerrarla? R: Bueno, aunque solo funciona en IE ya que el evento onBeforeUnload (quiere decir ...

  #181 (permalink)  
Antiguo 10/05/2004, 14:51
T4X
 
Fecha de Ingreso: enero-2004
Ubicación: myT-Base
Mensajes: 254
Antigüedad: 10 años, 10 meses
Puntos: 2
183.- Cómo cerrar una ventana preguntando si desea cerrarla o no

P: Cómo cerrar una ventana del explorador confirmando si desea cerrarla?

R:

Bueno, aunque solo funciona en IE ya que el evento onBeforeUnload (quiere decir un suceso antes de cambiar o cerrar la ventana).


El script consta así:

Código:
<script language="JavaScript">
function cierrame() { 
event.returnValue = "Escribe el texto a mostrar ";
}
</script>
Y en la etiqueta body donde va a salir el cierrame colocas esto:

Código:
<body onBeforeUnload="cierrame()">
Les repito que el comportamiento onBeforeUnload solo funciona con IE, aunque existen posibilidades de hacerlo funcionar con otro navegador de la misma especie....!!

Si lo desean, visiten el siguiente ejemplo:

[Ver ejemplo]
__________________
Ahora T4X es
WinGFX!!!!!

Última edición por T4X; 04/07/2004 a las 16:16
  #182 (permalink)  
Antiguo 10/05/2004, 20:16
 
Fecha de Ingreso: agosto-2003
Mensajes: 513
Antigüedad: 11 años, 3 meses
Puntos: 5
184.- Confirmar cierre de ventana

Siguiendo con el tema de T4X y a pedido de Tunait, les dejo el siguiente script:
Código PHP:
<html>
<
head>
<
script language="javascript">

function 
CloseClicked()
{
event.returnValue false;
};
</script>
</head>
<body onbeforeunload="CloseClicked();">
<form id="frmTest" name="frmTest" method="post" runat="server">
</form>
</body>
</html> 
Nota: PatomaS agregó que solo sirve para iexplorer y para mozilla 1.7

Espero les sea útil!
__________________
Saludos!!!
Maru.-

Última edición por Kaopectate; 24/05/2004 a las 16:09
  #183 (permalink)  
Antiguo 24/05/2004, 03:49
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.986
Antigüedad: 12 años, 11 meses
Puntos: 58
185.- Recoger valores de un formulario

P.- ¿Cómo recoger los valores de un formulario en la página de destino?

R.- Con este código:
Arreglado pequeño bug


Código PHP:
<html>
<
head>
<
script>

//Script original de KarlanKas para forosdelweb.com

enviado=location.href.split("?"); 
igualdades=enviado[1].split("&"); 

for(
a=0;a<igualdades.length;a++){ 
igualdades[a]=igualdades[a].split("+").join(" ");
valores=igualdades[a].split("="); 
eval(
"var "+valores[0]+"='"+valores[1]+"'"); 

 
</script> 
Es importante que el método empleado en el formulario sea GET.
__________________
Cómo escribir|Economia Finanzas Peru
No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia.

Última edición por KarlanKas; 04/01/2005 a las 11:56
  #184 (permalink)  
Antiguo 01/06/2004, 18:43
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
186.- Abrir enlace en un popup

P: ¿Como abrir un enlace en un popup?

R: Tal vez sea la manera menos usada, pero creo que la más fácil , simplemente abriendo un popup vacío desde el evento onclick del enlace, y que la ventana (segundo parámetro de open) coincida con el target del mismo enlace.

Código PHP:
<a href="destino.html" target="popup" onclick='window.open("", "popup", "")' popup </a
Hay otra forma que se discutió en este mensaje que sería más o menos así:

Código PHP:
<a href="destino.html" target="popup" onclick='window.open(this.href, this.target, ""); return false;' popup </a
Para pasar la validación estricta (w3.org) debe obviarse el atributo target, pero también se puede asignar en el mismo script

Código PHP:
<a href="destino.html" onclick='this.target = "popup"; window.open("", "popup", "")' popup </a

Última edición por caricatos; 16/11/2004 a las 05:35
  #185 (permalink)  
Antiguo 03/06/2004, 05:55
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
187.- Title mejorado (tooltip)

P: Puedo mejorar la visualización de los mensajes aclaratorios (title)

R: Mediante una combinación de las FAQ39 (http://www.forosdelweb.com/showthrea...744#post264744) Averiguar coordenadas del ratón, y FAQ57 (http://www.forosdelweb.com/showthrea...126#post267126) Mostrar/Ocultar capas.

Ejemplo:

Código PHP:
<html>
    <
head>
        <
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <
script type="text/javascript">
            var 
ns4 = (document.layers)? true:false
            
var ie4 = (document.all)? true:false
            
var ns6 = (document.getElementById && !document.all) ? truefalse;
            var 
coorXcoorY;

            if (
ns6document.addEventListener("mousemove"mouseMovetrue)
            if (
ns4) {document.captureEvents(Event.MOUSEMOVE); document.mousemove mouseMove;}

            function 
mouseMove(e)    {
                if (
ns4||ns6)    {
                    
coorX e.pageX;
                    
coorY e.pageY;
                }
                if (
ie4)    {
                    
coorX event.x;
                    
coorY event.y;
                }
                
coorX += document.body.scrollLeft;
                
coorY += document.body.scrollTop;
                return 
true;
            }

            function 
ini()    {
                if (
ie4)    document.body.onmousemove mouseMove;
            }

            function 
mostrar(dato)    {
                
with(document.getElementById("ayuda"))    {
                    
style.top coorY 10;
                    
style.left coorX 10;
                    
style.visibility "visible";
                    
innerHTML dato;
                }
            }

            function 
ocultar()    {
                
document.getElementById("ayuda").style.visibility "hidden";
            }

            function 
mover()    {
                
with(document.getElementById("ayuda"))    {
                    
style.top coorY 10;
                    
style.left coorX 10;
                }
            }

        
</script>
    </head>
    <body onload="ini()" >
        <div align=center>
            <h3>
                ... Mueve el raton por el texto ...
            </h3>
            <span
                onmouseover="mostrar('primer mensaje')"
                onmousemove="mover()"
                onmouseout="ocultar()">
                    Mensaje 1
            </span>
            <span
                onmouseover="mostrar('mensaje segundo')"
                onmousemove="mover()"
                onmouseout="ocultar()">
                    Mensaje 2
            </span>
        </div>
        <div
            id="ayuda"
            style=" visibility:hidden;
            position:absolute;
            background:yellow;
            font:normal 10px/10px verdana;
            color:black;
            border:solid 1px black;
            text-align:justify;
            padding:10px 10px 10px 10px;">
        </div>

    </body>
</html> 
Se pueden cambiar los estilos de la capa ayuda para personalizar la visualización.

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo

Última edición por caricatos; 06/08/2004 a las 03:37 Razón: faltaba considerar scroll
  #186 (permalink)  
Antiguo 11/06/2004, 05:04
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 11 años
Puntos: 2
188.- Abreviar una función para utilizarla muchas veces

P: ¿Cómo puedo utilizar varias funciones sobre muchos elementos de forma sencilla?

R: Para solucionarlo, utilizaremos "this" por el objeto sobre el que actuamos, es decir:

<script languaje='javascript'>
function manita(cual)
{
document.body.style.cursor='hand';
cual.style.backgroundColor="#00ffff";
};

function flecha(algo)
{
document.body.style.cursor='default';
algo.style.backgroundColor="#00ddff";
};
</script>


Y para actuar sobre el objeto (en el ejemplo, toda una fila):

<tr onmouseover="manita(this)" onmouseout="flecha(this)">

NOTA: Esto hace que causa y efecto se refieran siempre al mismo objeto (pongo el ratón sobre esta fila -> se ilumina toda la fila); para que causa y efecto se refieran a diferentes objetos (pongo el ratón en cierto botón -> se ilumina cierta celda en otro lugar) deberíamos entrar en el juego de name="tacata" o id="tacata" y usar manita(tacata)


-Gracias a JavierB por la "inspiración"-

COMPARTIENDO, MEJORAMOS TODOS

Última edición por Kaopectate; 11/06/2004 a las 06:46 Razón: Error en numeración reportado por Carlitos
  #187 (permalink)  
Antiguo 14/06/2004, 06:42
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
189.- DOM: Insertar nuevos elementos.

P: ¿Puedo Insertar nuevos elementos (tags) en una página dinámicamente?

R: DOM: creando el nuevo elemento con createElement y luego añadiéndolo con appendChild

Ejemplo:

var nuevoDiv = document.createElement("div");
nuevoDiv.align = "center";

document.body.appendChild(nuevoDiv);

Notas:

En el ejemplo se ha insertado una capa (div), pero puede hacerse con cualquier etiqueta válida.

La inserción se ha hecho al final del documento, pero se puede hacer al principio con insertBefore.

Se pueden insertar en cualquier sitio... creo recomendable usar getElementById para referenciar la etiqueta "padre" de donde se quiera insertar.

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo

Última edición por Kaopectate; 14/06/2004 a las 11:09 Razón: Arreglos en el título
  #188 (permalink)  
Antiguo 15/07/2004, 10:04
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8
190.-Aviso anti-popup

Consideraciones: En vista del aumento de herramientas anti-popup en navegadores, antivirus etc, los diseñadores de páginas web tenemos que "estrujarnos" un poco más la cabeza para ir adaptandonos a los cambios en las costumbres de los navegantes. Es posible que tengamos en nuestro sitio web una page que se abra como pop-pup, pero al estar activo el anti-popup, esta no se muestra, con la consiguiente pérdida de información para el sitio.

Pregunta: ¿Cómo puedo evitar que esto pase?
Respuesta: Mira a ver si con este código te sirve, es sencillito.
Creditos: epa4



Código:
<HTML>
<HEAD>
<TITLE>fullscreen</TITLE>
<script language="JavaScript"> 
function cerrar()
//esta función lo que hace es cerrar una página sin pedir confirmación
{
ventana=window.self;
ventana.opener=window.self;
ventana.close();
}

function pantallacompleta(pagina) 
{
var opciones=("toolbar=no, location=no, directories=no, status=no, menubar=no ,scrollbars=yes,resizable=no, fullscreen=yes"); 
var w=window.open(pagina,"ventana",opciones);
	if (w.name=="ventana") {
		cerrar();
	}
	else {
		window.document.writeln("Desactiva el bloqueo de poppus windows en tu equipo, de lo contrario\n"+ "no podrás entrar en la pagina o verla.");
		
	}
}
</script>
</HEAD>
<BODY  onload="javascript:pantallacompleta('http://www.tusitio.com/home.html');"> 
</BODY>
</HTML>
__________________

***Aprendiz de todo y maestro de nada***

Última edición por epa2; 15/07/2004 a las 10:07
  #189 (permalink)  
Antiguo 23/07/2004, 05:07
Avatar de epplestun  
Fecha de Ingreso: octubre-2001
Mensajes: 1.621
Antigüedad: 13 años
Puntos: 5
191.- Textos alternativos sin hacer uso de la etiqueta alt

Alterntiva a la super FAQ 187 de Caricatos

P: Como puedo crear textos alternativos sin hacer uso de la etiqueta alt?
R: Con un poco de imaginación y una simple capita .....

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

<html>
<head>
	<title></title>
</head>

<body>
<script type="text/javascript">
var x=0; var y=0;

if(!document.all) {
	document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = show;

function crearAlt(texto) {
	document.getElementById("ALTdHTML").innerHTML = '<div style="border: 1px solid #000000; background-color: #fdfec2; padding: 2px; font-size: 70%; font-family: verdana">' + texto + '</div>';
}

function show(evento) {
	document.getElementById("ALTdHTML").style.visibility = 'visible';
	if(document.all) {
		x = event.clientX;
		y = event.clientY + document.body.scrollTop;
	  	document.getElementById("ALTdHTML").style.left = x + 10;
	  	document.getElementById("ALTdHTML").style.top  = y + 14;
	} else {
		x = evento.clientX + document.body.scrollLeft;
		y = evento.clientY + document.body.scrollTop;
		document.getElementById("ALTdHTML").style.left = x + 10;
	  	document.getElementById("ALTdHTML").style.top  = y + 14;
	}
}

function hide() {
	document.getElementById("ALTdHTML").style.visibility = 'hidden';
	document.getElementById("ALTdHTML").innerHTML = "";
}	
</script>
<div id="ALTdHTML" style="position: absolute; visibility: hidden">&nbsp;</div>

<img src="" width="250" height="70" onMouseOver="crearAlt('Imagen');" onMouseOut="hide();">


</body>
</html>
__________________
Usuario registrado de Linux #288725

Última edición por Kaopectate; 03/11/2004 a las 07:07
  #190 (permalink)  
Antiguo 03/08/2004, 12:41
 
Fecha de Ingreso: junio-2004
Mensajes: 76
Antigüedad: 10 años, 5 meses
Puntos: 2
192. Resolución de pantalla

P Como puede saber un usuario su resolución de pantalla actual?

RUtiliza este codigo entre las etiquetas <body> y </body>

Código PHP:
Tu resolución actual es :
  <
script language="javascript">
var 
largo=screen.width;
var 
alto=screen.height;
document.write(largo+"x"+alto);
</script> 

Última edición por KarlanKas; 03/08/2004 a las 15:33 Razón: No funcionaba ni a tiros!
  #191 (permalink)  
Antiguo 04/08/2004, 04:00
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8
Añadir a Favoritos

193.- Añadir a favoritos

Pregunta: ¿Cómo puedo hacer para añadir una página a Favoritos?

Respuesta: Prueba con este código

Créditos: Bravenet

ObservacionesPara IE basta con pulsar en el link, para Opera y Nestcape será necesario pulsar la combinación de teclas Control + D



Código PHP:
<script type="text/javascript">
var 
text "!Méteme en Favoritos¡"
// Añade el URL de tu sitio
var site "http://www.tusitio.com";
// Añade el nombre o descripción de tu página
var desc "Descripción de tu pagina"
var ver navigator.appName
var num parseInt(navigator.appVersion)
if ((
ver == "Microsoft Internet Explorer")&&(num >= 4))
{
document.write('<a title="Hacer favoritos de esta página" href="javascript:window.external.AddFavorite(site,desc);" ');
document.write('onMouseOver=" window.status=')
document.write("text; return true ")
document.write('"onMouseOut=" window.status=')
document.write("' '; return true ")
document.write('">'text '</a>')
}
else
{
text += " (Ctrl+D)"
document.write(text)

</script> </span> 
__________________

***Aprendiz de todo y maestro de nada***
  #192 (permalink)  
Antiguo 19/08/2004, 02:05
Avatar de Sir Kevin  
Fecha de Ingreso: julio-2003
Ubicación: Barcelona
Mensajes: 25
Antigüedad: 11 años, 3 meses
Puntos: 0
194.- Como anular history en nuestra web

P: ¿Como se puede anular el history mientras se navegue por nuestra web?

R:
Es tan sencillo como colocar este script en la cabecera de cada una de nuestras páginas:
Código:
if(history.forward(1)){
 history.replace(history.forward(1));
 }
De esta forma si se carga una página nuestra utilizando el botón atrás se redirigirá al usuario a la siguiente página visitada, que si es nuestra y también lleva este código hará lo mismo mientras no sea la última página visitada por el usuario.
  #193 (permalink)  
Antiguo 27/08/2004, 11:36
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
195.- Seleccion en un select (formularios)

Pregunta: ¿Cómo puedo poner una opción de un select "selected"

Repuesta: Asignando al value del elemento select el value de la opción que se quiera seleccionar...

Ejemplo:

...
<body onload="document.forms['mi_Form']['mi_Select'].value = 'op2'" >
...
<form name='mi_Form' >
<select name='mi_Select' >
<option value='op1' > opción 1 </option>
<option value='op2' > opción 2 </option>
<option value='op3' > opción 3 </option>
</select>
...
</body>

Notas:
1. Evidentemente, el valor debe existir.
2. De la forma inversa se puede saber el valor seleccionado de un select con el value del mismo (Sería una simplificación de una FAQ anterior)

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo

Última edición por Kaopectate; 29/09/2004 a las 19:35 Razón: Error en numeración
  #194 (permalink)  
Antiguo 02/09/2004, 11:44
Avatar de Khronos  
Fecha de Ingreso: agosto-2004
Ubicación: Venezuela, PLC
Mensajes: 218
Antigüedad: 10 años, 2 meses
Puntos: 0
196.- Ocultar el contenido de una página hasta que se carguen todos sus elementos

Ocultar el contenido de una página hasta que se carguen todos sus elementos.

Ideal para páginas con muchas imágenes o galerías.

El fin es evitar que el usuario haga clic sobre una imagen mientras otras aun estén en proceso de carga, lo cual pudiere evitar que dicho proceso culmine exitosamente.

Método 1

Este procedimiento ha sido probado tanto para Internet Explorer como para Mozilla Firefox

1.- Colocar el siguiente javascript entre <head> y </head>
<script language="JavaScript" type="text/javascript">
function muestraGranDiv(){
document.getElementById('granDiv').style.visibilit y = "visible";
document.getElementById('cargando').style.visibili ty = "hidden";
}
</script>
2.- Cargar javascript (invocar función) en body mediante evento onLoad
<body onload="muestraGranDiv()">
3.- Colocar DIVs dentro del body
<div id="cargando" style="width: 100%; height: 500px; position: absolute; padding-top:20px; text-align:center"><span class="fontloadingcont">Loading content. Please wait...</span></div>
<div id="granDiv" style="visibility:hidden;">

resto del contenido dentro del DIV

<div>
El div de id="cargando", se usaría para colocar una advertencia al usuario, con la intención de que espere mientras se carga el contenido de la página. Fíjese que, obligatoriamente este div id="cargando", debe estar antes del div id="granDiv"

Para el aviso al usuario sobre la espera mientras se carga el contenido, puede usarse una imagen en vez de texto:
<div id="cargando" style="width: 100%; height: 500px; position: absolute; padding-top:20px; text-align:center"><img src="loading_content.gif"></div>
<div id="granDiv" style="visibility:hidden;">

resto del contenido dentro del DIV

<div>
El class="fontloadingcont" es el siguiente (puede ser usado como CSS interna o en un archivo CSS externo y es opcional):
<style type="text/css">
.fontloadingcont {
font-size: 20px;
font-weight: bold;
}
</style>
Si no desea usar un estilo CSS sobre el texto, no será necesario que mantenga las etiquetas <span></span>

Método 2

Otra posible forma de conseguir el objetivo

1.- Deshabilitar los links de las imágenes para que no ejecuten la función correspondiente
<a href="pagina.htm" onclick="return false"><img src="imagen.jpg" /></a>
2.- Colocar el siguiente javascript dentro de <head> y </head>
<script type="text/javascript">
function enlaces(){
for(m=0; m<document.getElementsByTagName('a'); m++){
document.getElementsByTagName('a')[m].onclick= function(){return true}
}
}
</script>
3.- Invocar la función dentro del body, mediante el evento onLoad
<body onload="enlaces()">
******************************************


Aviso:
Esta breve ayuda es un simple resumen de un tópico encontrado en la sección Javascript, bajo el número 228025. Sin embargo, la idea original proviene del usuario claray y una respuesta emitida por él en el tópico de número 224815. Posteriormente, la moderadora tunait aportó información para ampliar la ayuda y mejorar los códigos, permitiendo su compatibilidad tanto con Internet Explorer como con Mozilla, e incluso agregando posibilidad de colocar una advertencia para que el usuario espere mientras carga la página. El Método 2, proviene también como aporte de la moderadora tunait.
El resumen es aporte del usuario Khronos, quien no pretende atribuirse crédito alguno de las ideas provenientes de los autores(as) originales.
__________________
When someone dies in the grip of a powerful rage... A curse is born. The curse gathers in that place of death. Those who encounter it will be consumed by its fury.

Última edición por Kaopectate; 29/09/2004 a las 19:36 Razón: Error en numeración
  #195 (permalink)  
Antiguo 29/09/2004, 09:11
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.986
Antigüedad: 12 años, 11 meses
Puntos: 58
197.- Generador de claves


P.-¿Cómo puedo hacer que JS genere una clave aleatoria?
R.-Por medio de este código:

Las variables:
caracter: Poner aquí los caracteres válidos para formar la clave.
numero_caracteres: Poner la longitud de caracteres de la clave generada.
Código HTML:
<html>
<head>
<title>Clave Aleatoria</title>
<style>
*{font:normal 10px/10px verdana;}
input{border:solid 1px black;}
</style>
<script>
//Script original de KarlanKas para forosdelweb.com

	var caracter="1234567890";
	caracter+="QWERTYUIOPASDFGHJKLÑZXCVÇBNM";
	caracter+="qwertyuiopñlkjhçgfdsazxcvbnm";
	var numero_caracteres=8;

	var total=caracter.length;
	function azar(){
	var clave="";
	for(a=0;a<numero_caracteres;a++){
	clave+=caracter.charAt(parseInt(total*Math.random(1)));
	}
	document.forms[0].clave2.value=clave;
	}
</script>
</head>
<body onload="azar()">
<form>
Clave.-<input type="text" readonly="readonly"  name="clave2" id="clave2" />
<input type="button" value="regenerar clave" onclick="azar()" />
</form>
</body>
</html> 
__________________
Cómo escribir|Economia Finanzas Peru
No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia.

Última edición por KarlanKas; 04/01/2005 a las 11:57 Razón: Error en numeración
  #196 (permalink)  
Antiguo 08/10/2004, 05:21
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
FAQ198: DOM: Eliminar elementos.

P: Como eliminar elementos (etiquetas) dinámicamente.

R: DOM: Usando removeChild.

function eliminar(elemento) {
elemento.parentNode.removeChild(elemento);
}

ejemplo de uso:

<div onclick="eleiminar(this)" >clickéeme para borrarme</div>

Nota: complementa a la FAQ 189.

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #197 (permalink)  
Antiguo 26/10/2004, 06:08
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8
Faq 199 Efecto Fade de colores con el texto

Pregunta: ¿Cómo puedo crear un efecto fade de colores con el texto?
Respuesta: Con este pequeño script
Créditos: Bravenet

Código:
copia en el head lo siguiente....

<script type="text/javascript">
function change()
{
re="rgb("+Math.round(Math.random()*256)+","+Math.round(Math.random()*256)+","+Math.round(Math.random()*256)+")"
text.style.color=re;
}
setInterval(change,1000);
</script> 

luegon en el body pon algo así donde quisieras que el texto con el fade de colores apareciera

<p id="text"> Escribe aquí el mensaje. </p>
ale, a disfrutarlo
__________________

***Aprendiz de todo y maestro de nada***
  #198 (permalink)  
Antiguo 02/11/2004, 23:30
 
Fecha de Ingreso: octubre-2004
Mensajes: 704
Antigüedad: 10 años, 1 mes
Puntos: 3
De acuerdo 200.- Otra forma de apertura lateral de una ventana con variantes.

P: ¿Como puedo abrir una ventana de arriba hacia abajo y de izquierda a derecha?
R:
Créditos: http://www.lawebdejrolo.iespana.es/l...iptlateral.htm

1º) Entre las etiquetas <head> y </head> de tu página html poner:

<SCRIPT LANGUAGE="JavaScript">
function expandingWindow(website) {
var heightspeed = 2; // vertical scrolling speed (higher = slower)
var widthspeed = 7; // horizontal scrolling speed (higher = slower)
var leftdist = 0; // distance to left edge of window
var topdist = 0; // distance to top edge of window
if (document.all) {
var winwidth = window.screen.availWidth - leftdist;
var winheight = window.screen.availHeight - topdist;
var sizer = window.open("","","left=" + leftdist + ",top=" + topdist +
",width=1,height=1,scrollbars=yes");
for (sizeheight = 1; sizeheight <winheight; sizeheight += heightspeed) {
sizer.resizeTo("1", sizeheight);
}
for (sizewidth = 1; sizewidth <winwidth; sizewidth += widthspeed) {
sizer.resizeTo(sizewidth, sizeheight);
}
sizer.location = website;
}
else
window.location = website;
}
</script>

2º) Entre las etiquetas <body> y </body> hacer el llamado function:

<a href="nombredepagina.htm" alt="se expande"
onClick="expandingWindow('nombredepagina.htm');ret urn false;">Pulsa</a>

Nota: variando los valores de velocidad de vertical y horizontal puedes producir los efectos que más te gusten.

Un saludo cordial.-
paulkees
  #199 (permalink)  
Antiguo 11/11/2004, 13:46
Avatar de alexa10  
Fecha de Ingreso: julio-2002
Ubicación: De este lado...
Mensajes: 293
Antigüedad: 12 años, 3 meses
Puntos: 0
201.- css según resolución

P: como puedo utilizar una hoja de estilo, dependiendo de la resolución de la máquina cliente?
R:

Código:
<head>
  <link rel="stylesheet" type="text/css" id="hojaestilo">
  <script language="JavaScript" type="text/javascript">
  <!--
    document.getElementById('hojaestilo').href = screen.width + ".css";
   -->
  </script>
</head>
Y se crean tantos archivos css, como resoluciones se deseen tomar en cuenta, con el siguiente formato: xxxxxx.css, por ejemplo: 800.css, 1024.css
  #200 (permalink)  
Antiguo 16/11/2004, 06:26
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8
202.-Citas aleatorias

Pregunta: ¿Cómo puedo añadir a mi web citas aleatorias?
Respuesta: Con este pequeño código.
Créditos: Bravenet



En el head pon esto....

Código PHP:
<script type="text/javascript">
var 
Quotation=new Array()
Quotation[0] = "Foros del Web, el mejor sitio para aprender.";
Quotation[1] = "Escribe las citas que quieras en estos sitios.";
Quotation[2] = "Hoy es un día precioso para aprender algo nuevo";
Quotation[3] = "Soy un probecillo aprendiz.";
Quotation[4] = "Y encima nadie me hace caso en la vida :-(.";
var 
Quotation.length;
var 
whichQuotation=Math.round(Math.random()*(Q-1));
function 
showQuotation() {
document.write(Quotation[whichQuotation]);}
</script> 
Si quieres que aparezca en el body escribe lo siguiente....

Código PHP:
<script type="text/javascript">  showQuotation(); </script> 
¡ojo!
puedes configurarlo para que aparezca donde tu quieras, en una table, en un div, en un iframe, en un alert, en fin ....

tan solo comentar que puedes ir añadiendo mas citas, todas las que quieras, tan solo, en las nuevas citas, escribe...



Código PHP:
Quotation[5] = "Cuanto más aprendo, mas ignorante me siento";
Quotation[6] = "Creo que algún día tiraré la toalla :-("
y así sucesivamente con el 7, el 8, el 9, etc.

bueno, espero que os sirva para algo...

nos vemos pronto, cuidaos
__________________

***Aprendiz de todo y maestro de nada***

Última edición por epa2; 16/11/2004 a las 06:28
  #201 (permalink)  
Antiguo 29/11/2004, 14:27
Avatar de jordia  
Fecha de Ingreso: septiembre-2003
Ubicación: Cali
Mensajes: 77
Antigüedad: 11 años, 1 mes
Puntos: 0
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
__________________
Jorgediaz.info
La felicidad esta en acortar la brecha entre tus sueños y la realidad!!

Última edición por jordia; 23/12/2004 a las 14:23 Razón: Anexo y correcion
  #202 (permalink)  
Antiguo 18/12/2004, 04:36
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
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

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #203 (permalink)  
Antiguo 13/01/2005, 06:44
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8

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> 
__________________

***Aprendiz de todo y maestro de nada***

Última edición por epa2; 13/01/2005 a las 06:47
  #204 (permalink)  
Antiguo 13/01/2005, 06:51
Avatar de epa2  
Fecha de Ingreso: abril-2002
Ubicación: Málaga
Mensajes: 1.473
Antigüedad: 12 años, 7 meses
Puntos: 8

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()

__________________

***Aprendiz de todo y maestro de nada***

Última edición por epa2; 13/01/2005 a las 06:54
  #205 (permalink)  
Antiguo 24/01/2005, 11:25
Avatar de JavierB
Moderata
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.055
Antigüedad: 12 años, 9 meses
Puntos: 767
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>
  #206 (permalink)  
Antiguo 06/02/2005, 01:32
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.159
Antigüedad: 12 años, 7 meses
Puntos: 1143
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/

__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo

Última edición por KarlanKas; 06/09/2005 a las 02:36 Razón: Poner el número de FAQ
  #207 (permalink)  
Antiguo 27/02/2005, 18:40
Avatar de trasgukabi  
Fecha de Ingreso: septiembre-2004
Mensajes: 2.750
Antigüedad: 10 años, 2 meses
Puntos: 18
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)

Última edición por KarlanKas; 06/09/2005 a las 02:37 Razón: Poner el nº de FAQ
  #208 (permalink)  
Antiguo 07/03/2005, 15:17
Avatar de phpec  
Fecha de Ingreso: noviembre-2004
Mensajes: 70
Antigüedad: 10 años
Puntos: 0
Sonrisa 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>

Última edición por KarlanKas; 06/09/2005 a las 02:38
  #209 (permalink)  
Antiguo 05/04/2005, 15:01
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 9 años, 9 meses
Puntos: 9
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>


Última edición por programeitor; 17/10/2005 a las 19:54
  #210 (permalink)  
Antiguo 05/04/2005, 16:10
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 9 años, 9 meses
Puntos: 9
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]


Última edición por programeitor; 06/10/2005 a las 14:55
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado

SíEste tema le ha gustado a 103 personas (incluyéndote)




La zona horaria es GMT -6. Ahora son las 13:04.
SEO by vBSEO 3.3.2