Images PROYECTO INFORMÁTICA

Marzo 8 de 2017

Pautas del proyecto:

Realizar una pagina con la pestaña del inicio y derechos.

La pestaña de inicio debe tener:

Una caja de selección que de a elegir los días de lunes a jueves.

Una caja de texto validada para que se coloquen números del 1 al 30

Hacer los if correspondientes.

Al darle al botón de submit debe aparecer una mensaje en el lugar indicado según el if.

Día de entrega: 15 de marzo.

1. Pueden terminar el proyecto en Casa, basado en la copia de seguridad del grupo.

2. Los integrantes del grupo NO SE DEBEN REUNIR, cada uno debe trabajar desde su casa y comunicarse en horarios normales (6 a.m. hasta 7:00 p.m.) con sus compañeros de grupo.

3. No se admiten quejas sobre el hecho de haber trasnochado, lo que hace falta del trabajo deben realizarlo en grupo.

4. El día 2017-03-15, deben entregar la usb marcada(Primer Nombre, Primer Apellido), junto con la carpeta que se indico en clase.

5. El trabajo debe contener todas las recomendaciones que indico el docente en clase.

6. Se pedirá dicho trabajo a cualquier integrante del grupo.

7. Al inicio de clase se entregará el trabajo, no existirá tiempo para correcciones, debido a que ya fueron realizadas en casa por cada uno de los integrantes del grupo.

8. Cada integrante debe tener documentación sobre su proyecto en la usb, cuaderno y Blog. Exposición del trabajo despúes de la entrega de la Usb.

9. Todos los integrantes del grupo deben exponer.

Nota: Evaluación escrita individual sobre el trabajo.

Images Marzo 1 de 2017

codigos para hacer ventana modal sin javascript:
HTML
/* El botón */
‹a href=”#modal” title=”” class=”btn”›Pincha aquí‹/a›
/* La modal */
‹div id=”modal”›
   ‹a href=”#cerrar”›‹/a›
   ‹div id=”modalContent”›
      ‹h1›Soy una ventana modal‹/h1›
      ‹p›Hecha sin JS ni jQuery, solo CSS3‹/p›
      ‹a href=”#cerrar”›X‹/a›
   ‹/div›
‹/div›

CSS
/* Creamos unos estilos para el botón */
.btn{
   position:relative;
   padding:8px 16px;
   font-family:'psychotik';
   font-size:1.2em;
   font-weight:normal;
   color:#fff;
   text-shadow:none;
   border-radius:16px;
   background:#00A6B6;
   box-shadow:inset 2px 2px 1px #007f8b;
}
.btn:hover{
   background:#FF9C00;
   box-shadow:inset 2px 2px 1px #995f02;
}
/* Un bloque que ocupe toda la pantalla y contendrá nuestra modal... */
#modalContent{
   position:absolute;
   top:50%;
   left:50%;
   z-index:6;
   margin:-2% 0px 0px -150px;
   float:left;
   width:300px;
   color:#fff;
   line-height:22px;
   padding:15px;
   border-radius:5px;
   background:#00A6B6;
   border:1px solid #fff;
   box-shadow:0px 2px 1px #999;
}
/* ... los estilos de la ventana central ... */
#modal{
   position:fixed;
   top:0px;
   left:0px;
   z-index:5;
   float:left;
   width:100%;
   height:100%;
   background:rgba(0,0,0,0.2);
   display:none;
   opacity:0;
}
/* ... y un ‹a› transparente que ocupa todo el espacio para poder cerrar la modal desde cualquier punto */
#modal > a{
   position:fixed;
   top:0px;
   left:0px;
   z-index:1;
   float:left;
   width:100%;
   height:100%;
}
El elemento clave, le decimos que cualquier elemento susceptible de absorber esta propiedad, se muestre, o lo que es lo mismo, cuando pulsemos el botón, se ejecutará :target y nos mostrará la modal
:target{
   display:block!important;
   opacity:1!important;
}
/* Un botón de cerrar para no despistar al usuario */
#modalContent > a{
   position:absolute;
   top:-4px;
   right:-4px;
   color:#00A6B6;
   border-radius:2px;
   background:#fff;
   padding:4px;
}

Bootstrap jquery modal

En este artículo vamos a explicar como disponer de ventanas modales de Twitter Bootstrap Modals.

En nuestro <head> deberemos añadir los estilos de Bootstrap.

<link href="bootstrap.css" rel="stylesheet">

La ventana ya presenta una visualización bastante buena pero podemos cambiarla editando la hoja de estilos.

En nuestro <body> necesitaremos crear un link que abrirá la ventana:

<a data-toggle="modal" href="#example" class="btn btn-primary btn-large">Abrir ventana modal</a>

Ahora tendremos justo debajo el código que representa la ventana en display:none.

<div id="example" class="modal hide fade in" style="display: none;">
    <div class="modal-header">
        <a data-dismiss="modal" class="close">×</a>
        <h3>Cabecera de la ventana</h3>
     </div>
     <div class="modal-body">
         <h4>Texto de la ventana</h4>
        <p>Mas texto en la ventana.</p>                
    </div>
    <div class="modal-footer">
        <a href="index.html" class="btn btn-success">Guardar</a>
        <a href="#" data-dismiss="modal" class="btn">Cerrar</a>
    </div>
</div>

Y finalmente solo faltará incluir los scripts antes de la etiqueta de cierre </body>:

<script src="jquery.js"></script>
<script src="bootstrap-modal.js"></script>

Images Tipos de eventos

Feb 15 del 2017

Evento	Descripción	Elementos para los que está definido
onblur	Deseleccionar el elemento	<button>, <input>, <label>, <select>, <textarea>, <body>
onchange	Deseleccionar un elemento que se ha modificado	<input>, <select>, <textarea>
onclick	Pinchar y soltar el ratón	Todos los elementos
ondblclick	Pinchar dos veces seguidas con el ratón	Todos los elementos
onfocus	Seleccionar un elemento	<button>, <input>, <label>, <select>, <textarea>, <body>
onkeydown	Pulsar una tecla (sin soltar)	Elementos de formulario y <body>
onkeypress	Pulsar una tecla	Elementos de formulario y <body>
onkeyup	Soltar una tecla pulsada	Elementos de formulario y <body>
onload	La página se ha cargado completamente	<body>
onmousedown	Pulsar (sin soltar) un botón del ratón	Todos los elementos
onmousemove	Mover el ratón	Todos los elementos
onmouseout	El ratón "sale" del elemento (pasa por encima de otro elemento)	Todos los elementos
onmouseover	El ratón "entra" en el elemento (pasa por encima del elemento)	Todos los elementos
onmouseup	Soltar el botón que estaba pulsado en el ratón	Todos los elementos
onreset	Inicializar el formulario (borrar todos sus datos)	<form>
onresize	Se ha modificado el tamaño de la ventana del navegador	<body>
onselect	Seleccionar un texto	<input>, <textarea>
onsubmit	Enviar el formulario	<form>
onunload	Se abandona la página (por ejemplo al cerrar el navegador)	<body>

Images CRONOGRAMA PRIMER PERIODO

Images VENTANAS POP-UPS Y MODALES

Febrero 22 de 2017

Pop-ups:
El término denomina a las ventanas que emergen automáticamente (generalmente sin que el usuario lo solicite). A menudo, las ventanas emergentes se utilizan con el objetivo de mostrar un aviso publicitario de manera intrusiva. Una técnica relacionada a esta es la denominada pop-under (que consiste en abrir de manera intempestiva nuevas ventanas que se sitúan detrás de la ventana en uso).
Los anuncios pop-under (como dicho anteriormente) son una variedad de lo que son los pop-up. Este abre una ventana nueva en el navegador, detrás de ventana activa. Los pop-unders interrumpen menos a los usuarios, pero no son vistos hasta que el usuario cierre las ventanas que está utilizando, haciendo que sea más difícil para el usuario determinar qué página web las abrió.
En ocasiones, la ventanas emergentes o pop-ups, activan nuevas ventanas, lo que puede dar lugar a un bucle infinito, sea intencionado o no.
Debido a que la publicidad en formato ventana emergente es considerada molesta por muchos usuarios, continuamente aparecen técnicas y programas que, bajo el nombre común de anti pop-ups o en inglés pop-up Killers o pop-up blocker, evitan la aparición de este tipo de ventanas emergentes. Desde 2004, algunos de los sitios web más importantes comenzaron a limitar el uso de las ventanas emergentes por considerarlas un formato publicitario demasiado intrusivo. Tal es el caso de MSN.
Actualmente, muchos navegadores de Internet incorporan un sistema que evita la aparición de ventanas emergentes no solicitadas. Para determinar si una ventana emergente ha sido solicitada o no, se suele usar un antiguo principio de la programación HTML, que dice que una ventana sólo debe abrirse mediante un clic y que un solo un clic no debe abrir más de una ventana.
https://es.wikipedia.org/wiki/Ventana_emergente

 Ventana modal:Una ventana modal es una ventana que se encuentra sobre todas las demas ventanas de la misma aplicacion, hasta que se cierra o se abre otra ventana modal. Por ejemplo muchos de los dialogos de LabVIEW son Modales como los de opciones y propiedades.
http://digital.ni.com/public.nsf/allkb/7CCD41E4B665E196862573FC0076DC1F


codigo ventana modal

Images EVALUACIÓN

Febrero 8 de 2017

Hoy hicimos una evaluación, la cual consistía que una persona del grupo escribiera un correo al ingeniero con el nombre de los integrantes, también tenía que contener 1 url, ésta url se sacaba de una pagina de google streetview, en el que teníamos que buscar una dirección, copiar la url y pegarla en el correo, el primer correo que le llegara al ingeniero tenía 100 en la primera habilidad.
Nuestra nota fue: 100

Images Introducción del periodo

Feb 1 de 2017

Comenzamos un nuevo año con toda en informática, el ingeniero nos explicó qué haríamos en éste periodo y nos acordó algunas cosas, las primeras 3 semanas serán para recordar temas.