Octubre 25 del 2016

0 comentarios
El día de hoy se hizo la introducción al proyecto, explicando en qué consiste y se dió las pautas para el mismo, además, se explicaron las bases para comenzar a realizarlo. 

El proyecto consiste en crear una página web sobre una caricatura, la página web es un template descargado de internet, pero se personaliza de acuerdo al personaje, en mi caso, es Jimmy Neutrón.

¿Que es un template?

Un template es un conjunto de archivos que determinan la estructura y el aspecto visual de un sitio web, y tiene como ventaja principal disminuir tiempos y costos de desarrollo.

Un template es la solución ideal para muchos sitios web institucionales, ya que permiten resolver el aspecto gráfico del sitio en forma rápida y eficiente. Por supuesto que dependerá de cada empresa comprar un template o elegir

Elementos de un template

-Regiones: Son las áreas donde van los bloques de contenido.

-Gama de colores: Por lo general se utilizan entre dos y tres colores principales que hacen a la estética del sitio.

-Tipografías: Un template contempla los tamaños que deberían tener las tipografías, como así también el tipo de fuente a utilizar a lo largo de todo el sitio.

-Menúes de navegación: Por lo general se contempla un menú principal y uno secundario. Es importante que el diseño del menú principal esté cuidadosamente diseñado.

-Botones: Los botones son fundamentales en el sentido que los entendamos como verdaderos call to action.

-Formularios: En todo sitio web hay al menos un formulario de contacto que tiene elementos como las etiquetas (labels) y los cuadros de texto (form-text).

Tomado de: http://www.glidea.com.ar/blog/que-es-un-template




A continuación, algunos ejercicios en JavaScript:

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>

<script>
var a = parseFloat(prompt("Ingrese el primer numero, en caso de resta o division este es el numero al que se restara o dividira"));
var b = parseFloat(prompt("Ingrese el segundo numero"));


var multiplicacion = a * b
var div = a / b
var suma = a + b
var resta = a - b

document.write("suma="+suma + "<br>" + "resta="+resta + "<br>" + "multiplicacion="+multiplicacion + "<br>" + "division=" + division)

</script>

</body>
</html>

________________________________________________________________________

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Fahrenheit a Celcius</title>
</head>
<body>
<script>

var fahrenheit = parseFloat(prompt("Ingrese el valor en fahrenheit"));
var celcius = (fahrenheit - 32)*5/9;

if (fahrenheit <=  100000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000)
   {alert(celcius);}
else{alert("Error, debe digitar un número.")}



</script>
</body>
</html>







Publicar un comentario

Octubre 18 del 2016

0 comentarios
El día de hoy se realizó una evaluación con las siguientes preguntas:

1. Defina que es una ventana emergente o popup.

2. Escriba la URL de lugar donde se investigó.

3. Escriba el código para llamar ventanas popup.

                                   
Esta es la solución a las tres preguntas anteriores:

1. Un pop-up o ventana pop-up o ventana emergente, es una ventana nueva que aparece de repente en la pantalla de tu ordenador.

2. http://www.ajaxshake.com/

3. function popup(){
window.open("https://www.youtube.com/" , "youtube" , "width=600" , "height=600");} 

<a href="https://www.google.com.co/" target="_blank" onclick="javascript:popup()"> Google y youtube </a>

A continuación, algunos ejercicios de javascript.

Ejemplo de prompt:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Prompt</title>
</head>
<body>
<script>
var nombre = prompt("Ingrese su nombre" , "sálociN")
var edad = prompt("Ingrese su edad" , "51")
var color = prompt("Ingrese su color favorito" , "☺☻")

document.write("Hola " + nombre + " tienes " + edad +" años y tu color favorito es el " + color)

</script>
</body>
</html>

Ejemplo de funciones:

<!DOCTYPE html> 
<head>
<meta charset="UTF-8">
<title>Ejercicio 8 - Funciones básicas</title>
 
<script type="text/javascript">

//Escribir el código de una función a la que se pasa como parámetro un número entero y devuelve como resultado una cadena de texto que indica si el número es par o impar. Mostrar por pantalla el resultado devuelto por la función.

var numero = prompt("Introduce un número entero");
 
var resultado = parImpar(numero);
alert("El número "+numero+" es "+resultado);
 
function parImpar(numero) {
  if(numero % 2 == 0) {
    return "par";
  }
  else {
    return "impar";
  }
}
</script>
</head>
 
<body>
</body>
</html>

Ejemplo de confirm.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Confirm</title>
</head>
<body>
<script>

//Confirm se usa para que aparezca en pantalla un cuadro con una pregunta en donde solo hay dos opciones de respuesta, una es aceptar y la otra es cancelar (true y false respectivamente)

if (confirm("Hola, ¿eres mayor de edad?"))
{alert("Bienvenido al sitio web.");}
else 
{alert("Lo siento, no eres mayor de edad")}
</script>
</body>
</html>

Por último, un ejercicio que iba a ser una evaluación pero se cancelo, el ejercicio tiene que ver con el iva.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IVA</title>
</head>
<body>
<script>

var valor = parseFloat(prompt("Digite el valor","498"));
var iva = (valor*0.16);
var valorconiva = valor + iva;

if (valorconiva > 100)
{var sin = Math.sin(valorconiva)
document.write(sin)}
else
{for(i = 1; i<=10; i++)
{document.write("<hr>")}}


</script>
</body>
</html>







Publicar un comentario

Octubre 11 del 2016

0 comentarios
El día de hoy se resolvieron dudas referentes a la clase pasada, y se realizó una evaluación grupal.

A continuación, algunos códigos Javascript.

Utilizando confirm:


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Confirm</title>
</head>
<body>
<script>

//Confirm se usa para que aparezca en pantalla un cuadro con una pregunta en donde solo hay dos opciones de respuesta, una es aceptar y la otra es cancelar (true y false respectivamente)

if (confirm("Hola, ¿eres mayor de edad?"))
{alert("Bienvenido al sitio web.");}
else 
{alert("Lo siento, no eres mayor de edad")}
</script>
</body>
</html>

Utilizando prompt:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Prompt</title>
</head>
<body>
<script>
var nombre = prompt("Ingrese su nombre" , "sálociN")
var edad = prompt("Ingrese su edad" , "51")
var color = prompt("Ingrese su color favorito" , "☺☻")

document.write("Hola " + nombre + " tienes " + edad +" años y tu color favorito es el " + color)

</script>
</body>
</html>

Finalmente, utilizando funciones.


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Funciones</title>
</head>
<body>
<script>

function ejemploresta()
{resultado = numero1 - numero2; 
 document.write(resultado + "<hr>");}

var numero1 = 54
var numero2 = 32

ejemploresta();

var numero1 = 165
var numero2 = 132

ejemploresta();
document.write("<br><br><hr>");

function ejemplosuma(primernumero,segundonumero)
{resultado = primernumero + segundonumero;
 document.write(resultado + "<hr>"); return resultado;}

  ejemplosuma(65,549);
  ejemplosuma(52,195);
  ejemplosuma(15,165);

document.write(resultado);


</script>
</body>
</html>




Publicar un comentario

Octubre 4 del 2016

0 comentarios
El dia de hoy se resolvieron dudas con respecto a la información publicada en la página web coinsda, además, también se reforzó el tema de JavaScript.

A continuación, algunos ejercicios donde se utiliza el JavaScript.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Funciones básicas JavaScript</title>
</head>
<body>
 <h1>Funciones para cadenas de texto</h1>
<script>

   //mensaje.length; sirve para mostrar el numero de letras.
   var mensaje="Hola mundo";
   var numeroLetras = mensaje.length; 
   document.write(numeroLetras , ("<hr>"));

   //El signo [+] se utiliza para concatenar varias cadenas de texto.
   var mensaje1=" Habia";
   var mensaje2=" una";
   var mensaje3=" vez";
   document.write(mensaje1+mensaje2+mensaje3 , ("<hr>"));

   //Además del signo [+] se puede utilizar la funcion "concat()"
   var mensajeconcat = mensaje1.concat(mensaje3 + mensaje2);
   document.write(mensajeconcat , ("<hr>"));

   //Las cadenas de texto también se pueden unir con variables numéricas.
   var variable1="Hola";
   var variablenum="498";
   document.write(variable1.concat(" " + variablenum) , ("<hr>"));

   //toUpperCase() transforma los caracteres de una cadena de texto en mayuscula y toLowerCase() en minúscula.
   var mayuscula="EjEmPlO EN MayuSCULA, MinúSCULA y NorMaL";
   document.write(mayuscula , "<br>"); 
   document.write(mayuscula.toUpperCase(), "<br>");
   document.write(mayuscula.toLowerCase(), "<hr>");

   //charAt(posicion), obtiene el carácter que se encuentra en la posición indicada.
   var mensajeposición = "Hola";
   var letra = mensajeposición.charAt(1);
   document.write(letra);
   letra = mensaje.charAt(3);
   document.write(letra , "<hr>");

   //indexOf(caracter), calcula la posición en la que se encuentra el carácter indicado dentro de la cadena de texto. Si el carácter se incluye varias veces dentro de la cadena de texto, se devuelve su primera posición empezando a buscar desde la izquierda. Si la cadena no contiene el carácter, la función devuelve el valor -1.

   var mensaje = "Hola adios";
   var posición = mensaje.indexOf("s");
   document.write(posición , "<hr>");

   //Su función análoga es lastIndexOf(): lastIndexOf(caracter), calcula la última posición en la que se encuentra el carácter indicado dentro de la cadena de texto. Si la cadena no contiene el carácter, la función devuelve el valor -1.

   var posición = mensaje.lastIndexOf("o");
   document.write(posición , "<hr>");

   //substring(inicio, final), extrae una porción de una cadena de texto. El segundo parámetro es opcional. Si sólo se indica el parámetro inicio, la función devuelve la parte de la cadena original correspondiente desde esa posición hasta el final, si se indica un inicio negativo, se devuelve la misma cadena original.

   var porción = mensaje.substring(2 , 7);
   document.write(porción , "<hr>");

   //split(separador), convierte una cadena de texto en un array de cadenas de texto. La función parte la cadena de texto determinando sus trozos a partir del carácter separador indicado.

   var mensaje = "Esto es una cadena de texto";
   var palabras = mensaje.split(" ");
   document.write(palabras , "<hr>");

   var palabra = mensaje.split("");
   document.write(palabra, "<hr><h1> Funciones para arrays </h1><hr>");

   //Entre las funciones útiles para arrays tambien estan length, concat().

   var vocales = ["a", "e", "i", "o", "u"];  
   document.write(vocales.length, "<hr>");

   var array1 = ["1", "2", "3"];
   var array2 = ["4", "5", "6"];
   var arrayhecho = array1.concat(array2);

   document.write(array1.concat(["4", "9", "8"]), "<hr>");

   //join(separador), es la función contraria a split(). Une todos los elementos de un array para formar una cadena de texto. Para unir los elementos se utiliza el carácter separador indicado.

   var array = ["Hola" , "mundo" , "y" ,"adios"];
   var arrayjoin = array.join(" ");
   document.write(arrayjoin , "<hr>");

   //pop(), elimina el último elemento del array y lo devuelve. El array original se modifica y su longitud disminuye en 1 elemento.

   var arraypop = array.pop();
   document.write(array + "------------" + arraypop , "<br>" , array.length , "<hr>");

   //push(), añade un elemento al final del array. El array original se modifica y aumenta su longitud en 1 elemento. (También es posible añadir más de un elemento a la vez)

   var arraypush = array.push("jaja");
   document.write(array + "<hr>");

   //shift(), elimina el primer elemento del array y lo devuelve. El array original se ve modificado y su longitud disminuida en 1 elemento.

   var arrayshift = array.shift();
   document.write(array + "-----" +arrayshift + "<hr>");

   //unshift(), añade un elemento al principio del array. El array original se modifica y aumenta su longitud en 1 elemento. (También es posible añadir más de un elemento a la vez)

   var arrayunshift = array.unshift("Gracias");
   document.write(array , "<hr>");

   //reverse(), modifica un array colocando sus elementos en el orden inverso a su posición original:

   var arrayreverse = array.reverse();
   document.write(array + "<hr>" +"<h1>Funciones para numeros</h1>" +"<hr>"); 

   //NaN, (del inglés, "Not a Number") JavaScript emplea el valor NaN para indicar un valor numérico no definido (por ejemplo, la división 0/0).

   var numero1 = 0;
   var numero2 = 0;
   alert(numero1/numero2);

   //isNaN(), permite proteger a la aplicación de posibles valores numéricos no definidos

   if(isNaN(numero1/numero2)) {alert("La división no esta definida para los numeros indicados");}
   else{alert("La división es igual a => " + numero1/numero2);}

   //Infinity, hace referencia a un valor numérico infinito y positivo (también existe el valor –Infinity para los infinitos negativos)

   var numero1 = 10;
   var numero2 = 0;
   alert(numero1/numero2);

   //toFixed(digitos), devuelve el número original con tantos decimales como los indicados por el parámetro digitos y realiza los redondeos necesarios. Se trata de una función muy útil por ejemplo para mostrar precios.

   var numero3 = 79657.79879
   var numtoFixed = numero3.toFixed(4);
   document.write(numtoFixed)

</script>
</body>
</html>





Publicar un comentario