Tutoriales de Javascript

« ‹ 1 2/4 3 4 › »
Menú Microsoft en java
Introducción

Este es un menú como el de Microsoft en las ventanas, se coloca en la parte de arriba y se despliega, se le pueden agregar subcategorías y es totalmente configurable.

Características:

- Soporta frames y links del tipo "url" y "javascript:"
- Se pueden agregar categorías y subcategorías
- Compatible con Internet Explorer y Netscape.
- 100% configurable: Colores, fuentes, ancho, etc.
- Fácil de configurar (explicaciones dentro del script traducidas al español)
- 2 archivos: 1 HTML y 1 JS - Tamaño final: 36 KB
- Creadores: Tim Scarfe (http://www.g6jdw.net), Pete Woods y Mike Hall
El único requisito para utilizar este Javascript es nombrar a sus creadores (ver código fuente)

Es muy extenso para mostrarlo pero lo puedes descargar abajo.

Autor: Tim, Pete, Mike
Evitar re-envío en java
Introducción

Una manera de evitar que un formulario sea re enviado en dos ocasiones.

Paso 1

Primero crearemos la función que va detectar si el formulario ya se envió o si es la primera vez.
Esta parte tiene que estar en la cabecera head.



<script LANGUAGE="Javascript">
<!--
var cuenta=0;

function enviado() {                       
   if (cuenta == 0){
      cuenta++;
      return true;
   }
   else{
      alert("El siguiente formulario ya ha sido enviado, 
muchas gracias.");
      return false;
   }
}
//  -->
</script>


Paso 2

Ahora crearemos el formulario el cual queremos validar.
El formulario tiene que estar dentro de body.



<form method="post" action="javascript:void(0);" 
onsubmit="return enviado()">
  <div align="center"><center><table border="0" width="100%" 
cellspacing="0" cellpadding="0">
    <tr>
      <td width="12%">Nombre: </td>
      <td width="88%"><input type="text" name="name" 
size="20"></td>
    </tr>
    <tr>
      <td width="12%">E-mail: </td>
      <td width="88%"><input type="text" name="email" 
size="20"></td>
    </tr>
  </table>
  </center></div><p><input type="submit" value="Enviar 
formulario!"></p>
</form>


Autor: S/A
Máquina de escribir en java efectos
Introducción

Vea el siguiente script que escribe un texto con un efecto de una maquina de escribir, lo puedes colocar en tu pagina para que sea mas dinámica y llamativa.

Paso 1

Colocaremos el script dentro de body, es el código en donde colocaremos el texto que queremos que se muestre, y también le da el efecto de maquina.



<script language="Javascript">
<!--
var isIE4 = (navigator.appVersion.charAt(0)>=4 && (navigator.appVersion).indexOf
("MSIE") != -1); 
var isNN4 = (navigator.appVersion.charAt(0)>=4 && (navigator.appName).indexOf
("Netscape") != -1); 
tID = 0;
i = 0;
spd  = 50; 
str= "La máquina de escribir fue creada por Remington en el año 1873. 
Un siglo después la computadora se apoderaría del trono."
function typeLayer() {
 if(i >  str.length){
  clearTimeout(tID);
 } else {
  msg = str.substring(0,i);
  if(isNN4 == true){
   document.layers[layer1].document.write(<font face="Arial" color="#004080">
+msg.fontsize(2)+</font>);
   document.layers[layer1].document.close();
  }
  if(isIE4 == true){
   layer1.innerHTML = <strong><font face="Arial" color="#004080">+msg.fontsize(2)
+</font></strong>;
  }
  i++;
  tID = setTimeout("typeLayer()",spd);
 }
}
//-->
</script>
<span id="layer1" style="position: absolute; left: 10px; top: 20px"></span>


Paso 2

En la etiqueta body le agregaremos los siguientes eventos.



<body onload="typeLayer()" 
onunload="clearTimeout(tID)">


Autor: S/A
Detectar navegador en java
Introducción

Veamos como podemos detectar que tipo de navegador esta usando y en base a esto se redirecciona a una pagina especificada.

Un script que te puede servir para varias cosas, como manejar versiones (diseño, soporte, etc.) de tus páginas dependiendo el navegador.



<script LANGUAGE="Javascript">

<!--
var name = navigator.appName
 if (name == "Microsoft Internet Explorer")
   url=("explorer.htm");
 else
   url=("netscape.htm")
window.location=url;
//-->

</script>


Tienes que copiar el código dentro de body.

Autor: Gamaliel M.
Efectos cursor en java
Introducción

El efecto es que una imagen sigue al cursor dentro de toda la pagina, con un retraso para llegar a la posición del cursor.

Descripción:

- 8 divertidos Javascripts para el cursor del mouse
- Incluye los scripts: Ojos Locos, Cadena de Palabras, Estela del Mouse, etc.
- 100% configurable: Velocidad, tamaño, imágenes, etc.
- 14 archivos: 8 HTML y 6 Gif - Tamaño final: 14 KB
- Podes ver un ejemplo en esta página: Ojos Locos.

Autor: S/A
Efecto ventana en java
Descripción

Veamos una manera peculiar de abrir un popup, la ventana se abrirá con un efecto de crecimiento. 



<!-- Copiar dentro del tag BODY -->

<script language="Javascript">
<!-- Por Carlitos. Cualquier duda o pregunta, visita www.forosdelweb.com

var ancho=100
var alto=100
var fin=300
var x=100
var y=100

function inicio()
{
	ventana = window.open("hola.htm", "_blank", "resizable,
height=1,width=1,top=x,left=y,screenX=x,screenY=y");
	abre();
}
function abre()
{
	if (ancho<=fin) {
		ventana.moveTo(x,y);
		ventana.resizeTo(ancho,alto);
		x+=5
		y+=5
		ancho+=15
		alto+=15
		timer= setTimeout("abre()",1)
	}
	else {
		clearTimeout(timer)
		}
}
// -->
</script>

<form>
<input type="button" value="Abrir Ventana" onClick="inicio()"></p>
</form>


Autor: Carlos
Buscar palabras en java
Introducción

El siguiente javascript nos permite buscar palabras dentro de una página web. Una herramienta útil que se puede utilizar para buscar palabras en páginas que contienen mucho texto.

Tienes que copiar el script dentro de body.



<!-- Copiar dentro del tag BODY -->
<script language="Javascript">

// By Mike Hall (MHall75819@aol.com)

var NS4 = (document.layers); 
var IE4 = (document.all);

var win = window;    // Con frames usar top.nombre.window;
var n   = 0;

function findInPage(str) {

  var txt, i, found;

  if (str == "")
    return false;

  // Find next occurance of the given string on the page, 
wrap around to the
  // start of the page if necessary.

  if (NS4) {

    // Look for match starting at the current point. if not 
found, rewind
    // back to the first match.

    if (!win.find(str))
      while(win.find(str, false, true))
        n++;
    else
      n++;

    // if not found in either direction, give message.

    if (n == 0)
      alert("Not found.");
  }

  if (IE4) {
    txt = win.document.body.createTextRange();

    // Find the nth match from the top of the page.

    for (i = 0; i <= n && (found = txt.findText(str)) != 
false; i++) {
      txt.moveStart("character", 1);
      txt.moveEnd("textedit");
    }

    // if found, mark it and scroll it into view.

    if (found) {
      txt.moveStart("character", -1);
      txt.findText(str);
      txt.select();
      txt.scrollIntoView();
      n++;
    }

    // Otherwise, start over at the top of the page and find 
first match.

    else {
      if (n > 0) {
        n = 0;
        findInPage(str);
      }

      // Not found anywhere, give message.

      else
        alert("Not found.");
    }
  }

  return false;
}

</script>

<form name="search" onsubmit="return findInPage(this.string.value);">
  <font size="2"><p></font><font size="3"><input name="string" 
type="text" size="15"
  onChange="n = 0;"></font> <input type="submit" value="Buscar"> </p>
</form>


Autor: Mike Hall
Buscador - Base de datos en java
Descripción

XSearch 5.2 es una poderosa herramienta que realiza búsquedas internas en un sitio web. Se puede utilizar como buscador o base de datos. Es compatible con IE y NS.

Características:

- 2 archivos html (incluye el manual que está en ingles).
- 2 archivos JS - El buscador y la base de datos (palabras claves, direcciones url, etc)
- 1 archivo Gif (el botón buscar) y 1 Archivo CSS.

Autor: P. Bestebroer
Anular botones del mouse en java
Introducción

Con java podemos bloquear barias cosas, en este articulo bloquearemos los botones del mouse, podemos bloquear el botón derecho, izquierdo o ambos.

Botón derecho 

<!-- Botón derecho del mouse -->

<script LANGUAGE="Javascript1.1">
function derecha(e) {
if (navigator.appName == Netscape && (e.which == 3 || e.which == 2)){
alert(Botón derecho inhabilitado)
return false;
}

else if (navigator.appName == Microsoft Internet Explorer && (event.button == 2)){
alert(Botón derecho inhabilitado)
}
}
document.onmousedown=derecha
</script>


Botón izquierdo 

<!-- Botón izquierdo del mouse -->

<script LANGUAGE="Javascript1.1">

function izquierda(e) {
if (navigator.appName == Netscape && (e.which == 1 || e.which == 2)){
alert(Botón izquierdo inhabilitado)
return false;
}

else if (navigator.appName == Microsoft Internet Explorer && (event.button == 1)){
alert(Botón izquierdo inhabilitado)
}
}
document.onmousedown=izquierda
</script>


Ambos botones 

<!-- Botón izquierdo y derecho del mouse -->

<script LANGUAGE="Javascript1.1">


function ambos(e) {
if (navigator.appName == Netscape && (e.which == 1 || e.which == 3 || 
e.which == 2)){
alert(Los botones del mouse han sido inhabilitados)
return false;
}

else if (navigator.appName == Microsoft Internet Explorer && (event.button == 1 || 
event.button == 2)){
alert(Los botones del mouse han sido inhabilitados)
}
}
document.onmousedown=ambos
</script>


Autor: Gamaliel M.
Validación campos de formulario 3 en java
Introducción

Solo tienes que copear el código que esta abajo y si quieres puedes descargar el ejemplo funcionando al final. 



<html>
<head>
<title>Validación campos de formulario 3</title>
<p align="center"><b>Validación campos de formulario 3</b></p>

<script LANGUAGE="Javascript">
<!-- Begin
function checkFields() {
missinginfo = "";
if (document.form.name.value == "") {
missinginfo += "
 - Nombre";
}
if ((document.form.from.value == "") || 
(document.form.from.value.indexOf(@) == -1) || 
(document.form.from.value.indexOf(.) == -1)) {
missinginfo += "
 - Correo electrónico";
}
if ((document.form.website.value == "") || 
(document.form.website.value.indexOf("http://") == -1) || 
(document.form.website.value.indexOf(".") == -1)) {
missinginfo += "
 - Dirección de internet";
}
if(document.form.comments.value == "") {
missinginfo += "
 - Comentarios";
}

if (missinginfo != "") {
missinginfo ="_____________________________
" +
"Debes rellenar tu:
" +
missinginfo + "
_____________________________" +
"
Por favor inténtalo de nuevo";
alert(missinginfo);
return false;
}
else return true;
}
// end -->
</script>

</head>
<BODY style="font-family: Verdana">
<form action="http://cgi.freedback.com/mail.pl" name=form method=post 
onsubmit="return checkFields();">
<input type=hidden name=to value=spam-me-senseless@sitting-duck.net>
<input type=hidden name=subject value="Freedback">
<pre>Nombre: <input type=text name="name" size=30>
Correo electrónico: <input type=text name="from" size=30>
Dirección de internet: <input type=text value="http://" name="website" size=30>
Comentarios: 
<textarea rows=3 cols=40 name="comments"></textarea>
<input type=submit name="submit" value="Enviar">
</pre>
</form>
</body>
</html>


Autor: S/A
« ‹ 1 2/4 3 4 › »