Marzo 15 de 2017
Presentación del Proyecto
Realizar los siguientes cambios
- Cambiar la foto de Valeria Rojas y colocar la foto de Salma Osorio
- Desde "El ejercicio consistía en que si es un día par y es lunes o miércoles puede transitar" colocarlos subrayado y en negrita
Código del Proyecto
| <!DOCTYPE html> | |
| <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> | |
| <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> | |
| <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> | |
| <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <title></title> | |
| <meta name="description" content=""> | |
| <meta name="viewport" content="width=device-width"> | |
| <link rel="stylesheet" href="css/bootstrap.css"> | |
| <link rel="stylesheet" href="css/bootstrap-responsive.css"> | |
| <link rel="stylesheet" href="css/custom-styles.css"> | |
| <link rel="stylesheet" href="css/font-awesome.css"> | |
| <link rel="stylesheet" href="css/font-awesome-ie7.css"> | |
| <script src="js/modernizr-2.6.2-respond-1.1.0.min.js"></script> | |
| </head> | |
| <script> | |
| function s(){ | |
| var a = parseInt(document.getElementById("numbera").value); | |
| var lista = document.getElementById("opciones"); | |
| var valorSeleccionado = lista.options[lista.selectedIndex].value; | |
| if ( a <=30 ) | |
| { | |
| if (a > 0) | |
| { | |
| if (valorSeleccionado == 1 ) | |
| { | |
| if (a % 2 == 0 ) | |
| { | |
| var mensaje = 'PUEDE TRANSITAR'; | |
| var ventana = document.getElementById('miVentana'); // Accedemos al contenedor | |
| ventana.style.top = "0%"; | |
| ventana.style.bottom = "70px"; // Definimos su posición vertical. La ponemos fija para simplificar el código | |
| ventana.style.left = "0%"; | |
| ventana.style.right = "70px"; // Definimos su posición horizontal | |
| ventana.style.display = 'block'; // Y lo hacemos visible | |
| document.getElementById("mensaje1").innerHTML= mensaje; | |
| } | |
| else | |
| {var mensaje =' NO PUEDE TRANSITAR'; | |
| var ventana = document.getElementById('miVentana'); // Accedemos al contenedor | |
| ventana.style.top = "70%"; | |
| ventana.style.bottom = "0px"; // Definimos su posición vertical. La ponemos fija para simplificar el código | |
| ventana.style.left = "0%"; | |
| ventana.style.right = "0px"; // Definimos su posición horizontal | |
| ventana.style.display = 'block'; // Y lo hacemos visible | |
| document.getElementById("mensaje1").innerHTML= mensaje; | |
| } | |
| } | |
| else | |
| { | |
| if (a % 2 == 0) | |
| { | |
| var mensaje = 'PUEDE TRANSITAR'; | |
| var ventana = document.getElementById('miVentana'); // Accedemos al contenedor | |
| ventana.style.top = "0%"; | |
| ventana.style.bottom = "70px"; // Definimos su posición vertical. La ponemos fija para simplificar el código | |
| ventana.style.left = "70%"; | |
| ventana.style.right = "0px"; // Definimos su posición horizontal | |
| ventana.style.display = 'block'; // Y lo hacemos visible | |
| document.getElementById("mensaje1").innerHTML= mensaje; | |
| } | |
| else | |
| { | |
| var mensaje = 'NO PUEDE TRANSITAR'; | |
| var ventana = document.getElementById('miVentana'); // Accedemos al contenedor | |
| ventana.style.top = "70%"; | |
| ventana.style.bottom = "0px"; // Definimos su posición vertical. La ponemos fija para simplificar el código | |
| ventana.style.left = "70%"; | |
| ventana.style.right = "00px"; // Definimos su posición horizontal | |
| ventana.style.display = 'block'; // Y lo hacemos visible | |
| document.getElementById("mensaje1").innerHTML= mensaje; | |
| } | |
| } | |
| } | |
| else | |
| { | |
| alert("Debe ser un numero entero positivo entre 1 y 30"); | |
| } | |
| } | |
| else | |
| { | |
| alert("Debe ser un numero entero positivo entre 1 y 30"); | |
| } | |
| } | |
| function ocultarVentana() | |
| { | |
| //document.getElementById("reproductor").innerHTML=""; | |
| var ventana1 = document.getElementById('miVentana'); // Accedemos al contenedor | |
| ventana1.style.display = 'none'; // Y lo hacemos invisible | |
| } | |
| </script> | |
| <body> | |
| <!--[if lt IE 7]> | |
| <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p> | |
| <![endif]--> | |
| <!-- This code is taken from http://twitter.github.com/bootstrap/examples/hero.html --> | |
| <div class="container"> | |
| <div class="row-fluid"> | |
| <div class="span8 offset2"> | |
| <div class="site-header"> | |
| <div class="logo"> | |
| <h1>EJERCICIO</h1> | |
| </div> | |
| <div class="menu"> | |
| <div class="navbar"> | |
| <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> | |
| <i class="fw-icon-th-list"></i> | |
| </a> | |
| <div class="nav-collapse collapse"> | |
| <ul class="nav"> | |
| <li class="active"><a href="index.html">INICIO</a></li> | |
| <li><a href="DERECHOS.html">DERECHOS</a></li> | |
| </ul> | |
| </div><!--/.nav-collapse --> | |
| </div> | |
| <div class="mini-menu"> | |
| <label> | |
| <select class="selectnav"> | |
| <option value="#" selected="">Home</option> | |
| <option value="#">About</option> | |
| <option value="#">→ Another action</option> | |
| <option value="#">→ Something else here</option> | |
| <option value="#">→ Another action</option> | |
| <option value="#">→ Something else here</option> | |
| <option value="#">Services</option> | |
| <option value="#">Work</option> | |
| <option value="#">Contact</option> | |
| </select> | |
| </label> | |
| </div> | |
| </div> | |
| </div> | |
| <font > | |
| <pre >El ejercicio consistia en que si es un dia par y es lunes o miercoles puede transitar, | |
| y debera aparecer localizado en la parte superior izquiera, si es lunes o miercoles pero es | |
| impar debera estar localizado el no puede transitar en la parte inferior izquierda, si es un | |
| dia par y es martes o jueves puede transitar, y debera aparecer localizado en la parte superior | |
| derecha, si es martes o jueves pero si es impar debera estar localizado el "no puede transitar" | |
| en la parte inferior Derecha </pre></font> | |
| <form><span > <input id="numbera" type="number" name="edad" min="1" max="30" autocomplete="off" required="required"><span><br> | |
| <select id="opciones" autocomplete="off"> | |
| <option value="1">Lunes</option> | |
| <option value="2">Martes</option> | |
| <option value="1">Miercoles</option> | |
| <option value="2">Jueves</option> | |
| </select></form> | |
| <input type="button" value="click" onclick="s();"> | |
| <hr> | |
| <div id="miVentana" style="position: fixed; width: 350px; height: 190px; top: 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;"> | |
| <div style="font-weight: bold; text-align: left; color: #FFFFFF; padding: 5px; background-color:#ff8800" id="titulo"></div> | |
| <p style="padding: 5px; text-align: justify; line-height:normal" id="mensaje1"></p> | |
| <div style="padding: 10px; background-color: #F0F0F0; text-align: center; margin-top: 44px;"> | |
| <input id="btnAceptar" onclick="ocultarVentana();" name="btnAceptar" size="20" type="button" value="Cerrar Ventana" /> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="site-footer"> | |
| <div class="row-fluid"> | |
| <div class="span6 align-right"> | |
| <h1>Designed By</h1> | |
| <ul> | |
| <li><a href="http://www.alltemplateneeds.com">www.alltemplateneeds.com</a></li> | |
| <li><a href="http://www.alldesignneeds.com">www.alldesignneeds.com</a></li> | |
| </ul> | |
| </div> | |
| <div class="span6"> | |
| <h1>Images From</h1> | |
| <ul> | |
| <li><a href="http://www.wallpaperswide.com">www.wallpaperswide.com </a></li> | |
| <li><a href="http://www.wallcoo.net">www.wallcoo.net</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="js/jquery-1.9.1.js"></script> | |
| <script src="js/bootstrap.js"></script> | |
| <script> | |
| $('#myCarousel').carousel({ | |
| interval: 1800 | |
| }); | |
| </script> | |
| </body> | |
| </html> Realizado por: Valeria Rojas Orduz 10A
|
Comentarios
Publicar un comentario