Skip to content

Pedro / practica1-daw

Go to a project
Commit 3428b7d6 by Pedro
Options

Primera versión - terminada

parent 04874c90
Inline Side-by-side
Showing with 63 additions and 130 deletions
src/public_html/index.html
<!DOCTYPE html>
<html>
<script>
function mostrar() {
document.getElementById("sidebar").style.display = "none";
document.getElementById("main").style.display = "inline";
}
</script>
<script>
function ocultar(id) {
document.getElementById("sidebar").style.display = "block";
document.getElementById("main").style.display = "block";
}
</script>
<script>
function filtros() {
var cat1 = document.getElementById("todo");
var cat2 = document.getElementById("aceite");
var cat3 = document.getElementById("herramienta");
var checks = document.getElementsByClassName("aceitecont");
var checkss = document.getElementsByClassName("herramientacont");
if (cat1.checked) {
for (var i = 0; i < checks.length; i++) {
checks[i].style.display = "block";
}
for (var i = 0; i < checkss.length; i++) {
checkss[i].style.display = "block";
}
}
if (cat2.checked) {
for (var i = 0; i < checkss.length; i++) {
checkss[i].style.display = "none";
}
for (var i = 0; i < checks.length; i++) {
checks[i].style.display = "block";
}
}
if (cat3.checked) {
for (var i = 0; i < checkss.length; i++) {
checkss[i].style.display = "block";
}
for (var i = 0; i < checks.length; i++) {
checks[i].style.display = "none";
}
}
}
</script>
<head>
<link rel="shortcut icon" href="./images/icon.ico">
<title>AgroVid Jaén - Productos</title>
<title>AgroUja Jaén - Productos</title>
<script src="javascript.js"></script>
<link rel="stylesheet" href="css/estilo.css" />
<meta charset="UTF-8">
</head>
......@@ -67,14 +15,14 @@
<ul>
<li><input type="button" onClick="ocultar()" value="ON"></li>
<li><input type="button" onClick="mostrar()" value="OFF"></li>
<li><A href="./index.html"> Home</A></li>
<li><A href="./index.html"> Productos</A></li>
<li><A href="./index.html"> Contacto</A> </li>
<li><A href="index.html"> Home</A></li>
<li><A href="index.html"> Productos</A></li>
<li><A href="index.html"> Contacto</A> </li>
</ul>
</nav>
</div>
<div class="socialButtons">
<A href="./index.html">Iniciar sesión</A>
<A href="index.html">Iniciar sesión</A>
</div>
</div>
</header>
......@@ -86,16 +34,11 @@
<div id="sidebarContent" style="background-color:rgba(0, 0, 0, 0);">
<aside >
<div style="background-color:rgba(0, 0, 0, 0);">
<form>
<center> <label>Filtros de búsqueda</label><br><br>
</center>
<center> <label>Filtros de búsqueda</label><br><br> </center>
</div>
</aside>
<aside>
<div>
<label>Seleccione categoría</label><hr>
<input type="radio" id="todo" name="filtro">
<label for="todo">Todos los elementos</label><br><br>
......@@ -103,38 +46,29 @@
<label for="aceite">Aceites</label><br><br>
<input type="radio" id="herramienta" name="filtro">
<label for="herramienta">Herramientas</label> <br><br>
<center> <input type="button" onClick="filtros()" value="a ver"></center>
</form>
<center> <input type="button" onClick="filtros()" value="Buscar"></center>
</div>
<div>
<form>
<label>Seleccione marca:</label><hr>
<input type="radio" id="todo" name="filtro">
<label for="todo">Todos los elementos</label><br><br>
<input type="radio" id="aceite" name="filtro">
<label for="aceite">Aceites</label><br><br>
<input type="radio" id="herramienta" name="filtro">
<label for="herramienta">Herramientas</label> <br><br>
<div>
<label>Seleccione marca:</label><hr>
<input type="radio" id="marca1" name="filtro">
<label for="marca1">Marca 1</label><br><br>
<input type="radio" id="marca2" name="filtro">
<label for="marca2">Marca 2</label><br><br>
<input type="radio" id="marca3" name="filtro">
<label for="marca3">Marca 3</label> <br><br>
<center> <input type="button" onClick="filtros()" value="Buscar"></center>
<center> <input type="button" onClick="filtros()" value="a ver"></center>
</form>
</div>
<div>
<form>
<label>Seleccione rango de precios:</label><hr>
<input type="radio" id="todo" name="filtro">
<label for="todo">Todos los elementos</label><br><br>
<input type="radio" id="aceite" name="filtro">
<label for="aceite">Aceites</label><br><br>
<input type="radio" id="herramienta" name="filtro">
<label for="herramienta">Herramientas</label> <br><br>
<center> <input type="button" onClick="filtros()" value="a ver"></center>
</form>
<div>
<label>Seleccione rango de precios:</label><hr>
<input type="radio" id="precio1" name="filtro">
<label for="precio1">0 - 50 €</label><br><br>
<input type="radio" id="precio2" name="filtro">
<label for="precio2">50 - 100 €</label><br><br>
<input type="radio" id="precio3" name="filtro">
<label for="precio3">100 - 1000 €</label> <br><br>
<center> <input type="button" onClick="filtros()" value="Buscar"></center>
</div>
</aside>
</div>
......@@ -149,86 +83,85 @@
<ul>
<li>
<div class="aceitecont">
<img alt="nose" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" name="pro1" value="Bike">
<label for="vehicle1">Aceite - 0€</label>
<img alt="Producto 1" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="producto1" name="producto1">
<label for="producto1">Aceite - 0€</label>
</div>
</li>
<li>
<div class="aceitecont">
<img alt="nose" height="100" width="150" src="images/aceite.png"><br> <hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Aceite - 0€</label>
<img alt="Producto 2" height="100" width="150" src="images/aceite.png"><br> <hr>
<input type="checkbox" id="producto2" name="producto2">
<label for="producto2">Aceite - 0€</label>
</div>
</li>
<li>
<div class="aceitecont">
<img alt="nose" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Aceite - 0€</label>
<img alt="Producto 3" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="producto3" name="producto3">
<label for="producto3">Aceite - 0€</label>
</div>
</li>
<li>
<div class="aceitecont">
<img alt="nose" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Aceite - 0€</label>
<img alt="Producto 4" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="producto4" name="producto4">
<label for="producto4">Aceite - 0€</label>
</div>
</li>
<li>
<div class="aceitecont">
<img alt="nose" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Aceite - 0€</label>
<img alt="Producto 5" height="100" width="150" src="images/aceite.png"><br><hr>
<input type="checkbox" id="producto5" name="producto5">
<label for="producto5">Aceite - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 6" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto6" name="producto6">
<label for="producto6">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 7" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto7" name="producto7">
<label for="producto7">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 8" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto8" name="producto8">
<label for="producto8">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 9" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto9" name="producto9">
<label for="producto9">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 10" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto10" name="producto10">
<label for="producto10">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 11" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto11" name="producto11">
<label for="producto11">Pala - 0€</label>
</div>
</li> <li>
<div class="herramientacont">
<img alt="nose" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
<label for="vehicle1">Pala - 0€</label>
<img alt="Producto 12" height="100" width="150" src="images/pala.png"><br><hr>
<input type="checkbox" id="producto12" name="producto12">
<label for="producto12">Pala - 0€</label>
</div>
</li>
</ul>
<center> <input type="submit" value="Comprar"></center>
</form>
</section>
</main>
<footer>
</footer>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment