¡EJEMPLOS PAGINAS WEB HTML!
¡EJEMPLOS PAGINAS WEB HTML!
Hola! , cuanto tiempo, me alegro de verte,seguro que quieres revisar algunos ejemplos de websites con html y Javascript
Te invito a que pruebes el codigo!
<html>
<head>
<title>proyectogrupo_01_10a</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="css/style.css" type="text/css">
</style>
</head>
<script>
function verificar(){
var dia=document.getElementById("semana").value;
var caja=document.getElementById("valor").value;
if(caja.length!=0 && dia!=""){
if(!isNaN(caja)){
if(caja<=30 && caja>=1){
if(dia=="lunes" || dia=="miercoles" ){
if(caja%2==0){
// alert("Puede transitar (superior-izquierdo).");
var ventana = document.getElementById('miVentana'); // Accedemos al contenedor
ventana.style.top = "0px"; // Definimos su posición vertical. La ponemos fija para simplificar el código
ventana.style.left = "2px"; // Definimos su posición horizontal
ventana.style.display = 'block'; // Y lo hacemos visible
document.getElementById("mensaje1").innerHTML=" Puede transitar ";
}
else{
// alert("No puede transitar (inferior-izquierdo).");
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 = "2px";
ventana.style.display = 'block'; // Y lo hacemos visible
document.getElementById("mensaje1").innerHTML="No puede transitar ";
}
}
if(dia=="martes" || dia=="jueves" ){
if(caja%2==0){
// alert("Puede transitar (superior-derecho).");
var ventana = document.getElementById('miVentana'); // Accedemos al contenedor
ventana.style.top = "0px"; // Definimos su posición vertical. La ponemos fija para simplificar el código
ventana.style.left = "73%";
ventana.style.right = "0px"; // Definimos su posición horizontal
ventana.style.display = 'block'; // Y lo hacemos visible
document.getElementById("mensaje1").innerHTML=" Puede transitar ";
}
else{
//alert("No puede transitar (inferior-derecho).");
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 = "73%";
ventana.style.right = "0px"; // Definimos su posición horizontal
ventana.style.display = 'block'; // Y lo hacemos visible
//ventana.style.position = 'absolute';
document.getElementById("mensaje1").innerHTML="No puede transitar ";
}
}
}
else{
alert("El numero no esta entre 1 y 30");
}
}
else{
alert("No es un numero");
}
}
else{
alert("Seleccione una opcion");
}
}
function ocultarVentana()
{
//document.getElementById("reproductor").innerHTML="";
var ventana1 = document.getElementById('miVentana'); // Accedemos al contenedor
ventana1.style.display = 'none'; // Y lo hacemos invisible
}
</script>
<body>
<div id="header">
<div>
<a href="index.html" id="logo"><img src="images/fondo.png" alt=""></a>
<ul>
<li class="selected">
<a href="index.html">Ejercicio</a>
</li>
<li>
<a href="derechos.html">Derechos</a>
<ul>
</ul>
</li>
</ul>
</div>
</div>
<div id="capa">
<div id="miVentana" style="position: fixed; width: 350px; height: 190px; top: 0; font-family:Georgia, Arial, Helvetica, calibri; font-size: 12px; font-weight: normal; border: #333333 3px solid; background-color: #FFFFFF; color: #000000; display:none;">
<div style="font-weight: bold; text-align: left; color: #FFFFFF; padding: 5px; background-color:red" id="titulo"></div>
<p style="padding: 5px; text-align: justify; line-height:normal" id="mensaje1"></p>
<div style="padding: 10px; background-color: #F0F0FF; text-align: center; margin-top: 44px;">
<input id="btnAceptar" onClick="ocultarVentana();" name="btnAceptar" size="20" type="button" value="Cerrar Ventana" />
</div>
</div>
</div>
<center><table width="70%" border="2"></center>
<div id="main">
<div class="center">
<font color="FFFFFF"><h3>Ejercicio</h3><font>
<p>
<select name="semana" id="semana">
<option value="">Seleccione una opción</option>
<option value="lunes">Lunes</option>
<option value="martes">Martes</option>
<option value="miercoles">Miercoles</option>
<option value="jueves">Jueves</option>
</select>
</p>
<br><br>
<input type="text" name="valor" id="valor">
<br><br>
<button type="button" onclick='verificar()' >Oprime aqui</button>
<br />
<br />
</div>
</div>
</table>
<!--<div id="capa-impar">
<div id="miVentanaimpar" style="position: fixed; width: 350px; height: 190px; bottom: 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:#006394" id="titulo"></div>
<p style="padding: 5px; text-align: justify; line-height:normal" id="mensaje2"></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 id="footer">
<div>
<p>
<center><font color="#FFF"><h2>© Template Cinema Theather</h2></font></center>
</p>
</div>
</div>
</body>
</html>
