martes, 8 de noviembre de 2016

martes, 1 de noviembre de 2016

ENTREGA DEL PROYECTO. (CLASE N°33)

Se realiza entre del proyecto del CUARTO BIMESTRE teniendo en cuenta algunas condiciones como:

Criterios del Trabajo.
Su sitio web debe trabajar sin tener Internet.
El <title> en todas sus páginas debe contener su Primer Nombre y su primer apellido.
Debe tener un módulo llamado “derechos.html”, donde debe tener: Nombres y apellidos completos, foto de caracter serio, grado/grupo actual, indicar en 3 líneas por que le gusta el tema del trabajo seleccionado.
Todas las páginas de su proyecto deben tener el diseño de su template seleccionado.
Todas las páginas deben tener la posibilidad de navegar hacia cualquier punto de su sitio web.
Debe tener un módulo de nombre personajes.html, donde se mencionan los personajes de su tema.
Cada personaje debe tener una imagen y un texto alusivo a él.
(OPCIONAL)Al dar click sobre su imagen debe dirigirse a otra página donde debe visualizarse la misma imagen seleccionada y el texto alusivo al personaje; opcional en esta página si se desea visualizar mas imagenes o videos se puede hacer.
Debe visualizar a los personajes iniciando de los principales hasta los secundarios.
Lo máximo en personajes que debe visualizar es hasta 12. Si desea presentar más, lo puede realizar.
Debe tener copias de seguridad, ya sea en memoria usb personal( sólo suya, no compartida), en una nube personal ( sólo suya, no compartida ).
Datos de la Entrega
Entrega Martes 01 de Noviembre de 2016.
El proyecto debe ser entregado en cd.
Debe estar marcado con su primer nombre y su primer apellido, grado/grupo, número de lista.
El cd debe ser entregado al representante de clase.
Los cds deben estar ordenados en orden de lista.
Los archivos del proyecto deben estar guardados dentro de una carpeta marcada como (PRIMERapellido_PRIMERnombre_##) donde ## hace referencia a 9a ó 9b según sea su caso.
Esa carpeta es la que se debe guardar dentro del cd.
El proyecto debe tener como archivo inicial el index.html.

martes, 25 de octubre de 2016

TRADUCCIÓN DE PSEUDOCODIGO A JAVASCRIPT Y TEMPLATE.(CLASE N°32)

En esta clase el docente nos explico las pautas para hacer nuestro template. Ademas califico los ejercicios que el nos indico en la pagina.

EJEMPLO:
<html>
<head>
<title></title>
</head>
<body>
<script type=”text/javascript”>
var nota=parseFloat(prompt(“ingrese su nota”))
if(nota<70)[
alert(“no aprobó”)
]
else[
alert(” aprobó”)
]
<script>
</body>
</html>

<html>
<head>
<title></title>
</head>
<body>
<script type=”text/javascript”>
var b=parseFloat(prompt(“ingrese la base “))
var h=parseFloat(prompt(“ingrese la altura “))
var area=(b*h)/2
alert(“El area del triangulo es”+ ” ” +area)
<script>
</body>
</html>

martes, 18 de octubre de 2016

VENTANAS EMERGENTES. (CLASE N°31)

En esta clase el profesor nos explico el proyecto del bimestre, el cual es crear una página web teniendo como ayuda un templat; también nos explico mas a fondo el tema de ventanas emergentes y nos evaluó un indicador.

Template (Plantilla web) 

  • Una plantilla web (un template) es una forma de diseño de paginas web economicas, es un dispositivo que proporciona una separación entre la forma o estructura y el contenido de la pagina web. Es un medio o un aparato que permite guiar, portar o construir un diseño de la pagina web o esquema predefinido para los sitios web economicos. El contrario: diseño de la pagina web personalizado, exclusivo.
Tomado:http://www.designcompasscorp.com/index.phpoption=com_categoryblock&view=article&Itemid=97&id=617

Apertura y configuración de popups con javascript 

En determinadas ocasiones es muy útil abrir un enlace en una ventana secundaria, es decir, una ventana aparte que se abre para mostrar una información específica. Algunas ventajas de abrir un enlace en una ventana secundaria pueden ser que:Este artículo te enseñará en profundidad como abrir ventanas secundarias y configurar su forma.
  • El usuario no se marcha de la página donde estaba el enlace.
  • La ventana secundaria se puede configurar libremente con lo que se pueden hacer ventanas más grandes o pequeñas y con más o menos menús.
  • En general, el grado de control de la ventana secundaria utilizando Javascript aumenta.
Pincha aquí para ver lo que es una ventana secundaria
Para abrir una ventana secundaria podemos hacerlo de dos maneras, con HTML y con Javascript. Veamos cada una de ellas 

Abrir una ventana con HTML 

Se puede conseguir abrir una ventana secundaria muy fácilmente con tan solo HTML. Para ello podemos utilizar el atributo TARGET de las etiquetas HREF. Si ponemos target="_blank" en el enlace, la página se abrirá en una ventana secundaria. También podemos poner target="xxx" para que el enlace se presente el la ventana llamada xxx o en el frame xxx. 

El enlace tendría que tener esta forma: 

<a href="mipagina.html" target="_blank"> 

El problema de abrir una página secundaria con HTML consiste en que no podemos definir la forma de ésta ni podremos ejercer mayor control sobre élla, tal como comentábamos entre las ventajas de abrir una ventana secundária con Javascript. La ventana que se abre siempre será como el usuario tenga definido por defecto en su navegador. 

Abrir una ventana con Javascript 

Para abrir una ventana con Javascript podemos utilizar la sentencia window.open(). No pasa nada por que no conozcas Javascript, puesto que es muy sencillo utilizarlo para este caso. Vamos a ver paso a paso cómo abrir una ventana secundaria utilizando Javascript. 

1. Sentencia Javascript para abrir una ventana 

La sentencia es simplemente la función window.open(), lo más complicado es saber cómo utilizar esa función, pero ahora veremos que no reviste ninguna complicación. 

La función window.open() recibe tres parámetros, que se colocan dentro de los paréntesis, de este modo: 

window.open(URL,nombre_de_la_ventana,forma_de_la_ventana) 

Veamos rápidamente cada uno de estos parámetros por separado. 

URL: representa el URL que deseamos abrir en la ventana secundaria, por ejemplo http://www.desarrolloweb.com 
nombre_de_la_ventana: es el nombre que se le asigna a esta ventana para dirigir enlaces con el atributo target del HTML 
forma_de_la_ventana: se indica el aspecto que va a tener la ventana secundaria. Por ejemplo se puede definir su altura, anchura, si tiene barras de desplazamiento, etc 

Veamos un ejemplo de sentencia Javascript completa para abrir una ventana secundaria: 

window.open("http://www.desarrolloweb.com" , "ventana1" , "width=120,height=300,scrollbars=NO") 

Esto quiere decir que abra la página inicial de desarrolloweb.com en una ventana secundaria a la que vamos a llamar ventana1. Además, la ventana será de 120 pixels de ancho, 300 de alto y no tendrá barras de desplazamiento. 

Una aclaración adicional, si después de abrir esa ventana colocamos otro enlace en la página que abría la ventana cuyo atributo target está dirigido hacia el nombre_de_la_ventana (en este caso ventana1), este enlace se mostrará en la ventana secundaria. 

2. Función que abre una ventana 

Lo más cómodo para abrir una ventana es colocar una función Javascript que se encarge de las tareas de abrirla y que reciba por parámetro la URL que se desea abrir. 

El script es sencillo, veámoslo a continuación: 

<script language=javascript> 
function ventanaSecundaria (URL){ 
   window.open(URL,"ventana1","width=120,height=300,scrollbars=NO") 

</script> 


3. Colocamos un enlace 

Este enlace no debe estar dirigido directamente a la página que queramos abrir, sino a la sentencia Javascript necesaria para abrir la ventana secundaria. Para ejecutar una sentencia Javascript con la pulsación de un enlace lo hacemos así: 

<a href="javascript:sentencia_javascript_para_abrir_la_ventana"> 

4. El enlace llama a la función que abre la ventana 

Ahora Veamos cómo quedaría todo ese enlace en la página. 

<a href="javascript:ventanaSecundaria('http://www.desarrolloweb.com')"> Pincha en este enlace para abrir la ventana secundaria</a> 

Que da como resulado: 
Pincha en este enlace para abrir la ventana secundaria 

(En la página que vayamos a colocar este enlace deberíamos tener el script que hemos hecho anteriormente que contenía la función para abrir la ventana.)

Hay que fijarse que las comillas simples que se colocan para definir el URL que se pasa como parámetro de la función ventanaSecundaria(). Son comillas simples porque el href del enlace ya tiene unas comillas dobles, y dentro de comillas dobles siempre se han de utilizar comillas simples a no ser que deseemos cerrar las comillas dobles. 

Parámetros para dar forma a una ventana 

Estos atributos los puedes utilizar en la función window.open() para definir la forma que deseas que tenga tu ventana secundaria. 
WidthAjusta el ancho de la ventana. En pixels
HeightAjusta el alto de la ventana
TopIndica la posición de la ventana. En concreto es la distancia en pixels que existe entre el borde superior de la pantalla y el borde superior de la ventana.
LeftIndica la posición de la ventana. En concreto es la distancia en pixels que existe entre el borde izquierdo de la pantalla y el borde izquierdo de la ventana.
ScrollbarsPara definir de forma exacta si salen o no las barras de desplazamiento. scrollbars=NO hace que nunca salgan. Scrollbars=YES hace que salgan (siempre en ie y solo si son necesarias en NTS).
ResizableEstablece si se puede o no modificar el tamaño de la ventana. Con resizable=YES se puede modificar el tamaño y con resizable=NO se consigue un tamaño fijo.
Directories 
(barra directorios)
A partir de aquí se enumeran otra serie de propiedades que sirven para mostrar o no un elemento de la barra de navegación que tienen los navegadores más populares, como podría ser la barra de menús o la barra de estado. 

Cuando ponemos el atributo=YES estamos forzando a que ese elemento se vea. Cuando ponemos atributo=NO lo que hacemos es evitar que ese elemento se vea.
Location 
(barra direcciones)
Menubar 
(barra de menús)
Status 
(barra de estado)
Titlebar
(la barra del título)
Toolbar 
(barra de herramientas)

Abrir una ventana sin un enlace 

En otras ocasiones desearemos abrir una ventana secundaria automáticamente, es decir, sin necesidad de que el usuario pulse sobre ningún enlace. En este caso, el código de la función ventanaSecundaria nos sirve también y habrá que añadir una línea de código Javascript a continuación de la función ventanaSecundaria. Esta línea a añadir simplemente será una llamada a la función que se ejecutará según se está cargando la página. Veamos como quedaría este código: 

<script language=javascript> 
function ventanaSecundaria (URL){ 
   window.open(URL,"ventana1","width=120,height=300,scrollbars=NO") 


ventanaSecundaria("http://www.desarrolloweb.com"); 
</script> 


Queda en negrita lo que sería la llamada a la función que abre la ventana secundaria, como está fuera de una función se ejecuta según se está cargando la página. 
Referencias: Hemos publicado un manual en DesarrolloWeb.com que explica en detalle cómo controlar ventanas secundarias. No solo abrirlas, también aprendemos a cerrarlas, comunicar entre ventanas, etc. Control de ventanas en Javascript
También hemos propuesto crear un popup con Javascript y capas (DHTML), que evita los sistemas que bloquean ventanas secundarias, ya que no es exactamente una ventana.
Tomado de:http://www.desarrolloweb.com/articulos/18.php

martes, 11 de octubre de 2016

EVALUACIÓN. (CLASE N°30)

Funciones parseInt(), parseFloat()


parseInt() y parseFloat()

parseInt() y parseFloat() son funciones creadas para parsear un string y devolver un número si es posible. Los espacios iniciales y finales se ignoran.
JavaScript analiza la cadena para extraer las cifras que encuentre al principio. Estas cifras al principio del string son las que se transforman a tipo numérico. Cuando se encuentra el primer carácter no numerico se ignora el resto de la cadena. Si el primer carácter encontrado no es convertible a número, el resultado será NaN (Not a Number).
Cuando el valor no es un string, JavaScript hace primero una conversión implícita a string. Esta conversión, en el caso de objetos, se hace llamando al método toString(). Podemos reescribir este método para algunos objetos si nos interesa asegurarnos de que devuelvan un stringconvertible a número.

parseInt(string, radix) - Conversión de string a entero

radix es opcional y representa la base en la que estamos trabajando. Normalmente trabajaremos en base decimal y este será el valor tomado por defecto en los navegadores modernos (como se define en ECMAScript 5). En navegadores antiguos (IE7, IE8) los número que empiezan por "0" se consideran en base octal por defecto, a no ser que se indique explícitamente el radix 10.
El prefijo 0x indica que el número está en hexadecimal aunque no se incluya radix 16.
Algunos ejemplos:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
parseInt("10");         // 10
parseInt("10.8");       // 10
parseInt("10 22");      // 10
parseInt(" 14 ");       // 14
parseInt("20 dias");    // 20
parseInt("Hace 20 dias"); // NaN
parseInt("44aa33bb");   // 44
parseInt("3.14");       // 3
parseInt("314e-2");     // 314
parseInt("");           // NaN  ->  ¡¡el string vacio se convierte a NaN!!
parseInt(null);         // NaN
 
parseInt("10",10);      // 10
parseInt("010");        // 10  ¡¡ * 8 en navegadores antiguos *  !!
parseInt("10",8);       // 8
parseInt("0x10");       // 16   0x indica que el número es hexadecimal
parseInt("10",16);      //16

paseFloat(string) - Conversión de string a número en coma flotante

En este caso no existe radix. El número siempre se interpreta como decimal, independientemente de cualquier prefijo que le pongamos (0 para octal ó 0x para hexadecimal).
La diferencia con el anterior, ademas de admitir decimales, es que los números en coma flotante admiten la notación exponencial, del tipo "314e-2" o "0.0314e+2".
Si la función encuentra un carácter que no sea un número (0-9), un signo (+ o -), un punto decimal o un exponente, ignorará todos los caracteres que vengan a continuación.
Algunos ejemplos;
1
2
3
4
5
6
7
8
9
10
parseFloat("3.14");      // 3.14
parseFloat("314e-2");    // 3.14
parseFloat("0.0314E+2"); // 3.14
parseFloat("3.14dieciseis"); // 3.14
parseFloat("A3.14");     // NaN
parseFloat("tres");      // NaN
parseFloat("e-2");       // NaN
parseFloat("0x10");      // 0     ->  No admite el prefijo 0x para indicar 'hexadecimal'
parseFloat("");          // NaN   ->  ¡¡el string vacio se convierte a NaN!!
parseFloat(null);        // NaN
Esta función es muy util para convertir valores en pixels o puntos, de CSS, en valores numéricos:
1
parseFloat("5px");      // 5

TOMADO DE: http://notasjs.blogspot.com.co/2013/06/funciones-parseint-parsefloat-number-y.html