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