window JavaScript. Métodos. Efectos. confirm, prompt, open, moveBy, moveTo, focus, resize, close (CU01174E)

alert (mensaje)

Muestra una ventana de diálogo con la cadena especificada o con la conversión a string del objeto pasado como parámetro y un botón “Aceptar”

alert('hola usuario');

confirm (mensaje)

Abre un cuadro de diálogo con un mensaje y dos botones, Aceptar y Cancelar. Devuelve un valor booleano: true si se pulsa aceptar o false si se pulsa cancelar.

if (window.confirm("Va a salir de la aplicación ¿Desea salir realmente?")) { window.alert('Gracias por visitarnos'); }

// Si usuario pulsa aceptar se cumple la condición

clearInterval (referenciaTimer)

Ya estudiado. Ver entregas anteriores.

Ya estudiado. Ver entregas anteriores.

clearTimeout (referenciaTimer)

Ya estudiado. Ver entregas anteriores.

Ya estudiado. Ver entregas anteriores.

open (opURL, opName)

Uso habitual var nuevaVentana = window.open (…) donde nuevaVentana es una referencia al objeto window que se crea. opURL es un parámetro opcional, url a cargar en una nueva pestaña. opName nombre opcional que puede usarse para fijar atributo target en un link.

var nuevaVentana = window.open ('http://aprendeaprogramar.es', 'miNombre');

//Si no se especifica url de destino, se abre una pestaña en blanco

open (opURL, opName, opParametros)

Uso habitual var nuevaVentana = window.open (…) donde nuevaVentana es una referencia al objeto window que se crea. opURL es un parámetro opcional, url a cargar en la nueva ventana. opName: nombre, opcional, puede usarse para fijar atributo target en un link. opParametros es una lista de parámetros como left ó top para posición, height o width para dimensiones, outerHeight, outerWidth, innerHeight, innerWidth, menubar, toolbar, location, resizable, scrollbars, status, titlebar…

var nuevaVentana = window.open ('http://aprendeaprogramar.es', 'miNombre', ', , resizable=true, menubar=yes');

// Puede haber diferencias entre navegadores en la respuesta a algunos de los parámetros

close()

Cierra una ventana. Sólo se pueden cerrar ventanas que hayan sido abiertas por un script. No es posible cerrar la ventana principal del navegador por no abrirse por un script.

nuevaVentana.close();

//Cierra la ventana

moveBy (valorX, valorY)

Desplaza el objeto window una distancia valorX en horizontal y valorY en vertical, en píxeles, respecto de su posición inicial (movimiento relativo). No se pueden desplazar ventanas no creadas con scripts.

nuevaVentana.moveBy(200, 200);

nuevaVentana.focus();

// Si no usamos focus() la ventana puede perder el foco y no ser visible.

Si la ventana contiene una url que no pertenece al mismo directorio-dominio que la ventana madre podemos obtener un error de tipo Error: Permission denied to access property 'moveBy'

focus()

Pone el foco en una ventana que lo ha perdido

nuevaVentana.focus();

moveTo(coordX, coordY)

Coloca el objeto window en una posición valorX en horizontal y valorY en vertical, en píxeles, respecto de la esquina superior izquierda de la pantalla. No se pueden desplazar ventanas no creadas con scripts.

nuevaVentana.moveTo(0, 0);

nuevaVentana.focus();

// Si no usamos focus() la ventana puede perder el foco y no ser visible.

print()

Abre el cuadro de diálogo para imprimir por impresora el contenido de la ventana

window.print();

prompt(msg, opValorDefecto)

Muestra un cuadro de diálogo pidiendo una entrada al usuario y, opcionalmente, un valor de defecto. Devuelve un objeto String con el contenido introducido por el usuario, o null si se pulsa la tecla cancelar. Si se pulsa aceptar sin introducir nada retorna una cadena vacía.

var persona = prompt("¿Cuál es tu nombre?", "Barack Obama");

if (persona != null) {alert("Hola " + persona);}

//Por ejemplo <<Hola Pedro>>

resizeBy (varX, varY)

Modifica el tamaño de la ventana agrandándola o empequeñeciéndola en la cantidad de pixels indicada por varX para la dimensión horizontal o varY para la dimensión vertical. No se pueden redimensionar ventanas no creadas con scripts.

nuevaVentana.resizeBy(250, 250);

nuevaVentana.focus();

// Si no usamos focus() la ventana puede perder el foco y no ser visible.

resizeTo(ancho, alto)

Modifica el tamaño de la ventana y lo establece a los valores de ancho y alto especificados. No se pueden redimensionar ventanas no creadas con scripts.

nuevaVentana.resizeTo(100, 100);

nuevaVentana.focus();

// Si no usamos focus() la ventana puede perder el foco y no ser visible.

scrollBy(varX, varY)

Hace scroll en la ventana en la cantidad de pixels indicada por varX para la dimensión horizontal o varY para la dimensión vertical.

window.scrollBy(0, 400);

//Desplaza el scroll 400 píxeles hacia abajo

scrollTo(posX, posY)

Hace scroll hasta dejar como la esquina superior izquierda a posX pixeles del origen en horizontal y posY píxeles en vertical.

window.scrollTo(0, 400);

//Coloca el scroll 400 píxeles por debajo del origen

scrollByLines(numLin)

Hace scroll hacia arriba o abajo en el número de líneas especificado. Una línea se corresponde con un párrafo <p>.

window.scrollByLines(20);

setInterval(…)

Ya estudiado. Ver entregas anteriores.

Ya estudiado. Ver entregas anteriores.

setTimeout

Ya estudiado. Ver entregas anteriores.

Ya estudiado. Ver entregas anteriores.

stop()

Detiene la carga de los contenidos de la ventana de la misma manera que si el usuario pulsara el botón para detener la carga en el navegador.

window.stop();

Otros

blur() quita el foco, btoa('cadena') codifica en base-64 una cadena y atob(referencia) decodifica una referencia codificada en base-64, fullScreen() indica si la ventana está a pantalla completa o no, find('cadena') para buscar una cadena en la ventana, minimize() para minimizar la ventana

Algunos de estos métodos no son soportados por todos los navegadores. No vamos a ver ejemplos de ellos.

<!DOCTYPE html>

<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">

<script type="text/javascript">

var start = 0;

var positionY = window.innerHeight/2-125;

var nuevaVentana;

var controlSinusoidal=0;

 window.onload = function () {

                var ejemplo = document.getElementById('ejemplo');

                ejemplo.addEventListener("click", ejecutarEjemplo);

}

function ejecutarEjemplo () {

                nuevaVentana = window.open ('', 'miNombre', 'width=250, height=250, resizable=true, menubar=yes');

                nuevaVentana.document.write('<h1>Aprenda a programar ahora. Aproveche la oportunidad</h1>');

                nuevaVentana.focus();

                nuevaVentana.moveTo(0,positionY);

                nuevaVentana.setInterval( sine, 1000/30 );

}

function sine(){

  controlSinusoidal = controlSinusoidal + Math.PI/256;

  positionY = 100*Math.sin(controlSinusoidal);

  start += 2;

  nuevaVentana.moveTo(start, window.innerHeight/2-100+positionY);

}

</script>

</head>

<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>

<div style="color:blue; margin:20px;" id ="ejemplo">Pulsa aquí</div>

</body>