[2017-22-02]
CLASE 04:
Se realizó evaluación correspondiente a la habilidad # 2, esta se basa en ejercicios de aplicación sobre inner HTML.
EVALUACIÓN:
<html>
<head>
<title>Ejercicio 2</title>
</head>
<script >
function i(){
var a= parseInt(document.getElementById("a").value);
var rta= (a*19/100)
//document.getElementById("rta").value= a * 19/100 ;
document.getElementById("mirespuesta").innerHTML= a * 19/100 ;
}
</script>
<body>
<div id="mirespuesta"></div>
VALOR DEL PRODUCTO <input type="text" id="a"><br><hr><hr>
<input type="button" value="valor del iva" onclick="i();"><br>
</body>
</html>
display:none (Oculta Información)
Se realizó evaluación correspondiente a la habilidad # 2, esta se basa en ejercicios de aplicación sobre inner HTML.
EVALUACIÓN:
<html>
<head>
<title>Ejercicio 2</title>
</head>
<script >
function i(){
var a= parseInt(document.getElementById("a").value);
var rta= (a*19/100)
//document.getElementById("rta").value= a * 19/100 ;
document.getElementById("mirespuesta").innerHTML= a * 19/100 ;
}
</script>
<body>
<div id="mirespuesta"></div>
VALOR DEL PRODUCTO <input type="text" id="a"><br><hr><hr>
<input type="button" value="valor del iva" onclick="i();"><br>
</body>
</html>
- Se explica el Tema sobre Ventanas Emergentes y Ventanas Modales:
VENTANA EMERGENTE O POP UP:
- Llamar otra página y necesitan permisos del cliente.
Una ventana emergente (en inglés se le conoce como pop-up window) es una ventana del navegador de internet que:
- Aparece automáticamente, sin ser solicitada.
- Usualmente despliega publicidad
- Dirige tráfico de Internet a ciertas páginas
- Recopila direcciones de correo electrónico.
También existen ventanas emergentes que son
parte de una página web.
Una nueva variante de las ventanas emergentes es
que en lugar de que las ventanas aparezcan encima de las demás, aparecen por
debajo de la ventana en la que está navegando el usuario, ocultando así qué página
originó la ventana emergente.Se le conoce en inglés como pop-under (aparece por debajo).
Es posible abrirlas, cerrarlas y pasar datos de una ventana a otra.
TOMADO DE:
CÓDIGO DE LA VENTANA EMERGENTE:
<html>
<head>
<title>emergente</title>
</head>
<body>
<a href="#"onclick='javascript:window.open
("pagina.html","_blank","width=800,height=1200,menubar=no,top=40,left=50")'>Abrir</a>
<br><br><br>
<span
onclick='javascript:window.open("http://www.google.com","_blank")'>hola</span>
<br><br>
<input type="button"
onclick="javascript:window.close();" value="Cerrar esta
Pagina">
</body>
</html>
WINDOW.OPEN: Tiene 3 parámetros: " ", " ", " "
- El primer parámetro es: Página o producto que se va a abrir o mostrar.
- El Segundo parámetro es: Dónde se va abrir (self o blank)
- El Tercer parámetro son: Las Propiedades (medidas (px) y menubar (yes o no)).
top y left: Esquina superior Izquierda.
NOTA: Las pantallas crecen de izquierda-a-derecha y arriba-hacia-bajo.
VENTANA MODAL:
Se divide en Dos el tamaño horizontal para que quede en la mitad de la página.
Una
ventana modal es una ventana que se encuentra sobre todas las demás ventanas de
la misma aplicación, hasta que se cierra o se abre otra ventana modal.
TOMADO DE:
Elementos básicos que se necesitan para realizar una ventana modal
con HTML y Javascript.
Se necesita un contenedor, un espacio donde ubicar el contenido web que deseamos mostrar. Normalmente esto se hace con la etiqueta DIV. Este contenedor formará parte de la página web, pero no se mostrará cuando se visualice la página: será un elemento invisible. Luego necesitamos alguna manera de mostrar el contenedor, y su contenido, cuando nos haga falta.Por último, necesitaremos también alguna forma de ocultar el contenedor.
Se necesita un contenedor, un espacio donde ubicar el contenido web que deseamos mostrar. Normalmente esto se hace con la etiqueta DIV. Este contenedor formará parte de la página web, pero no se mostrará cuando se visualice la página: será un elemento invisible. Luego necesitamos alguna manera de mostrar el contenedor, y su contenido, cuando nos haga falta.Por último, necesitaremos también alguna forma de ocultar el contenedor.
Al final de la sección body de la página web el siguiente código:
<div id=”miVentana” style=”position: fixed; width: 350px; height:
190px; top: 0; left: 0; font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 12px; font-weight: normal; border: #333333 3px solid;
background-color: #FAFAFA; color: #000000; display:none;”>
Aquí se coloca el contenido web
</div>
Aquí se coloca el contenido web
</div>
Atributos
más importantes del DIV son:
id: el identificador del
elemento, que nos permitirá recuperarlo y acceder a él a través del DOM.
display: le indicamos al navegador que no muestre este elemento (none).
display: le indicamos al navegador que no muestre este elemento (none).
No hay comentarios:
Publicar un comentario