EFECTOS DE JAVASCRIPT PARA USAR EN PGINAS WEB

Cdigos de Javascript para insertar en pginas y blogs

Mostrar mensajes de bienvenida y despedida en una pgina
Funcin muy utilizada para mostrar un saludo o bienvenida cuando el usuario
carga la pgina y es opcional mostrar otro cuando sale de la pgina o cierra el
navegador. Para eso se usan las funciones ONLOAD y ONUNLOAD.
<script type="text/javascript">
window.onload=function(){alert('Bienvenido a esta
pagina');}
window.onunload=function(){alert('Vuelva en otro
momento');}
</script>
Si la pagina utiliza el evento onload para iniciar otras funciones es necesario
incluir la anterior de la siguiente forma: prrafo con un identificador nombrado:
'link1' (puedes darle otro nombre):
<script type="text/javascript">
window.onload = function()
{
funcion1(){alert('Bienvenido a esta pagina');}
funcion2();
funcion3();
}
</script>
Aadir efectos a los vnculos
1- Muestra un cuadro de alerta con un mensaje al poner el ratn encima de un
vnculo. Prubalo:Vnculo
<a href="http://tu-sitio.com"
onmouseover="javascript:alert('Mensaje');return
false">Vnculo</a>
2- Muestra un mensaje de alerta al hacer clic sobre un vnculo, antes de enviar al
usuario al destino. Prubalo: Vnculo
<a href="http://tu-sitio.com"
onclick="javascript:alert('Mensaje');">Vnculo</a>

Profesor: Alex Soto

3- Aumenta el tamao del texto del vnculo al poner el ratn encima, al quitarlo
restaura el texto a su tamao original. Prubalo: Vnculo
<div id="vinc"><a href="http://tu-sitio.com"
onmouseover="javascript:
void(document.getElementById('vinc').style.fontSize='3em')"
onmouseout="javascript:
void(document.getElementById('vinc').style.fontSize='1em')"
> Vnculo</a></div>
4- Mensaje de confirmacin antes de enviar el usuario a una pgina.
Prubalo: Vnculo
<a href="javascript:if (confirm('Quieres entrar a
NorfiPC?'))
{parent.location='http://norfipc.com/index.html';};">Vncul
o</a>

Contador de visitantes engaoso.

Script curioso pero engaoso para exagerar la supuesta cantidad de visitantes
de una pagina.
Usted es el visitante 42756 de esta pgina.
<script type="text/javascript">
var ran
ran = Math.round(Math.random()*50000)
document.write("Usted es el visitante " + ran + " de esta
pgina.")
</script>

Botn para imprimir pgina

<input type="button" value="Imprime esta pgina"

onclick="window.print()">

Profesor: Alex Soto

Crear restricciones al uso del ratn

Deshabilitar el uso del clic derecho por completo
<script type="text/javascript">
document.oncontextmenu = function(){return false}
</script>
Impedir la seleccin y la copia de texto en una pgina
<script type="text/javascript">
window.onload = function()
// Para internet Explorer
{document.onselectstart = function(){return false;}
// Para Firefox
document.onmousedown = function(){return false;}}
</script>

Accin al dar un clic derecho

Mostrar un mensaje o ejecutar otra accin al dar un clic derecho.
<script type="text/javascript">
//<![CDATA[
function right(e) {
if (navigator.appName == 'Netscape' && e.which == 3) {
alert('Prohibido clic derecho');
return false;}else
if (navigator.appName == 'Microsoft Internet Explorer'
&& event.button==2) {
alert('Prohibido clic derecho');return false;}return true;}
document.onmousedown = right;
//]]>
</script>
Establecer como pgina de inicio
Propone al usuario establecer esta pgina como su pgina de inicio (Solo
Internet Explorer)

Profesor: Alex Soto

<a href="javascript:if
(document.all){document.body.style.behavior='url(#default#h
omepage)';
document.body.setHomePage('http://norfipc.com');};">
Hazme tu pgina de inicio</a>
Guardar una pgina en los favoritos del navegador
Vinculo que permite al lector agregar una pgina a sus favoritas.
Se usa un cdigo Browser Sniffer o sea si el navegador es Internet Explorer se
ejecuta una funcin diferente que si es Firefox.
<a href="javascript:if(navigator.appName.indexOf('Microsoft
Internet Explorer')!=-1){window.external.AddFavorite
(''+window.document.URL,''+window.document.title);}
if(navigator.appName.indexOf('Netscape')!=1){window.sidebar.addPanel(''+window.document.title,''+wind
ow.document.URL,'')}
else{parent.location=(location.href);}">Guardar</a>
Se mostrar de la siguiente forma:
Agrega esta pgina en tus favoritas en el siguiente link:

Guardar

Texto parpadeante
Hola
Si deseas insertarle un vnculo al texto parpadeante utiliza el segundo DIV, (solo
puede existir en el cdigo in ID nico).
<script type="text/javascript">
window.setInterval (BlinkIt, 500);
var color = "red";
function BlinkIt () {
var blink = document.getElementById ("blink");
color = (color == "#ffffff")? "red" : "#ffffff";
blink.style.color = color;
blink.style.fontSize='36px';}
</script>
<div id="blink">Hola!</div>
<div id="blink"
onclick="parent.location='http://norfipc.com'">
Hola!</div>

Profesor: Alex Soto

Vnculo para sugerir una pgina

Permite sugerir una pgina, enviando por email su ttulo y URL.
<a
href="javascript:location.href='mailto:?SUBJECT=Te%20sugier
o:
'+document.title+'&amp;BODY='+escape(location.href);void
0">
Sugerir esta pgina</a>

Cmo insertar los cdigos en un blog de WordPress o Blogger?

Si no tienes una pgina web propia, solo un blog en WordPress o Blogger,
tambin puedes usar los cdigos perfectamente. Estos CMS permiten insertar
cdigo Javascript, siempre que no sea intrusivo y afecte el cdigo fuente,
cualquiera de esta pgina puedes insertar. Para hacerlo haz lo siguiente.
En WordPress
En la vista de diseo o normal escribe cualquier palabra que te servir de gua,
por ejemplo CODIGO, cambia entonces a vista HTML, localiza donde est la
palabra usada y sustityela por el cdigo, as de simple, solo verifica que no est
insertada entre dos tags como: <p>CODIGO</p>, de ser as elimnalos.
En Blogger
El editor de Blogger permite insertar cualquier cdigo Javascript.
Para eso haz lo siguiente:
Abre el editor y escoge "Diseo" en la barra lateral.
Selecciona: "Aadir un Gadget"
De los Gadgets predeterminados que se muestran escoge: "HTML/Javascript"
Pega el cdigo en la ventana, guarda los cambios y mueve el Gadget al lugar de
la pgina necesario.

Profesor: Alex Soto

JAVASCRIPT: OPERACIONES Y FUNCIONES MATEMTICAS BSICAS

las funciones de JavaScript para poder realizar
operaciones matemticas bsicas. Algo indispensable cuando se trabaja en
sitios que contienen cdigo dinmico.

Como realizar sumas de dos o mas nmeros

1

var operador1, operador2, suma;

suma = operador1 + operador2;

Realizar resta (diferencia) de dos nmeros

1

var operador1, operador2, resta;

resta = operador1 - operador2;

Multiplicacin
1

var operador1, operador2, multiplicacion;

multiplicacion = operador1 * operador2;

Divisin
1

var divisor, dividendo, division;

division = divisor / dividendo;

Potencia de un nmero
1

var potenica = Math.pow()

Raz cuadrada
1

var raizCuadrara = Math.sqrt(9);

alert(raizCuadrara);

Redondear un valor
1

var redondea = Math.round(9.45);

alert("Valor redondeado 9.45= "+redondea);

Redondear un nmero al entero mas cercano

1

redondea = Math.ceil(9.01);

Profesor: Alex Soto

alert("Valor ceil 9.01= "+redondea);

Decrementar al entero inferior

1

redondea = Math.min(9.01);

alert("Valor min 9.01= "+redondea);

Decrementar al entero inferior

1

redondea = Math.floor(9.99);

alert("Valor floor 9.99= "+redondea);

// //decrementar al entero inferior

Obtener el valor mximo de una serie de valores

1

var valorMaximo = Math.max(20,15,10,3,28,64,74,13,76);

alert("El valor maximo es:"+valorMaximo);

// //Valor maximo de una serie de valores

Obtener el valor mnimo de una serie de valores

1

var valorMaximo = Math.min(20,15,10,3,28,64,74,13,76);

alert("El valor minimo es:"+valorMaximo);

// //Valor maximo de una serie de valores

Valor absoluto de un nmero

1

var absoluto = Math.abs(-10);

alert(absoluto);

// // valor absoluto

Calcular el seno de un nmero

1

var seno = Math.sin(30);

alert("El seno de 30 = "+seno);

// // Seno

Calcular el coseno de un nmero

1

var coseno = Math.cos(30);

alert("El coseno de 30 = "+coseno);

// // Coseno

Profesor: Alex Soto

Generar un nmero aleatorio

1

var aleatorio = Math.random();

alert(aleatorio);

// //Generar valor aleatorio

Generar un nmero aleatorio de 0 a X

1

var aleatorio = Math.floor(Math.random()*101);

alert(aleatorio);

// //Generar valor aleatorio entre 0 a 100

Generar un nmero aleatorio de 0 a X con

decimales
//Generar valor aleatorio entre 0 a 10

var aleatorio = Math.floor(Math.random()*10) + Math.random();

alert(aleatorio);

Obtener el valor de PI
1

alert(Math.PI);

Profesor: Alex Soto

OPERADORES ARITMTICOS
En los primeros ejemplos de este tutor tan slo se han usado sentencias
muy simples como asignar un valor a una variable, mediante el operador
de asignacin, =, o realizar operaciones aritmticas, pero evidentemente
JavaScript puede realizar ms operaciones. En esta seccion y las siguientes
se presentan los operadores de que dispone este lenguaje clasificados en
varios grupos, segn el contexto en el que se usen. Comenzamos con los
ms conocidos, los operadores aritmticos.
Suma +
Se trata de un operador usado para sumar dos valores numricos o para
concatenar cadenas entre s o nmeros y cadenas.
var var1 = 10, var2= "Buenos", var3 = "
das", var4 = 31;

document.write(var1+var4)

/* resultado

41 */

document.write(var2+var3)

/* resultado:

Buenos das */

document.write(var1+var3)

/* resultando:

10 das */
Resta Operador usado para restar valores numricos. Puede actuar sobre un
nico operando numrico cambindole de signo.
var num1 = 10, num2 = 8, res = 0;

res = num1 - num2;

Profesor: Alex Soto

/*res contiene 2 */

res = -res

/*

ahora res contiene -2*/

Producto ( * ) y cociente ( / )
Realizan las operaciones aritmticas de multiplicar y dividir dos valores
numricos.
var op1 = 50, op2= 4, div, mul;

div = op1/op2

/*div

contiene 12.5 */

mul = op1 * op2

/*mul

contendr 200 */

Resto %
Tambin llamado operador mdulo calcula el resto de una divisin.
var op1 = 50, op2= 4, resto;

resto = op1 % op2;

/*resto

contiene 2 */

Incremento ( ++) y decremento (--)

Estos operadores se usan para incrementar o decrementar en 1 el valor de
una variable. Si el operador se antepone a la variable la operacin de
incremento o decremento es prioritaria sobre cualquier otra.
var op1=5, op2 = 5, res;

Profesor: Alex Soto

10

res = ++op1;

/*res

toma el valor 6 y luego op1 el 6*/

res = op1++;

/*res

toma el valor 5 y luego op2 el 6*/

Operadores compuestos
Los operadores +, -, *, / pueden asociarse con el operador de asignacin
(=) para cambiar el valor de una variable numrica por incrementndolo,
decrementndolo, multiplicndolo o dividindolo por un valor. El
operador += puede usarse igualmente con variables de cadena.
var num = 20, cad = "buena";

num += 5;

/*num

adquiere el valor 25 (20 + 5) */

cad += 's' ;

/*cad

adquiere el valor 'buenas' */

Profesor: Alex Soto

11