Autor
Bueno, la cosa es que yo no se nada de JQuery asi que por ahí buscando y buscando solo logre conseguir este código:
Código:
<html>
<head>
<title>Mostrar Ocultar</title>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$("#mayoria_edad").click(function(evento){
if ($("#mayoria_edad").attr("checked")){
$("#formulariomayores").css("display", "block");
}else{
$("#formulariomayores").css("display", "none");
}
});
});
</script>
</head>
<body>
<form>
Nombre: <input type="text" name="nombre">
<br>
<input type="checkbox" name="mayor_edad" value="1" id="mayoria_edad"> Soy mayor de edad
<br>
<div id="formulariomayores" style="display: none;">
Dato para mayores de edad: <input type="text" name="mayores_edad">
</div>
</form>
</body>
</html>
Esto lo que hace es que cuando el usuario presiona el botón "checked" el Style display: none; se desactica y en su lugar se activa el Style display: block;
La cosa es que como no se nada de JQuery ni javascript entonces no lo se modificar y yo lo que quiero es que los usuarios tengan, digamos seis checkbox uno para cada categoria:
Código:
<input type="checkbox" name="StyleLapiz" value="1" id="Lapiz">
<input type="checkbox" name="StyleBoligrafo" value="2" id="Boligrafo">
<input type="checkbox" name="StyleCreyon" value="3" id="Creyon">
<input type="checkbox" name="StyleAnimal" value="4" id="Animal">
<input type="checkbox" name="StylePersonas" value="5" id="Personas">
<input type="checkbox" name="StyleAnime" value="6" id="Anime">
Y luego, las imágenes:
Código:
<div class="Lapiz Animal"><img src="Dibujo_001.png" /></div>
<div class="Boligrafo Animal"><img src="Dibujo_002.jpg" /></div>
<div class="Creyon Animal"><img src="Dibujo_003.jpg" /></div>
<div class="Lapiz Personas"><img src="Dibujo_004.jpg" /></div>
<div class="Boligrafo Personas"><img src="Dibujo_005.jpg" /></div>
<div class="Creyon Personas"><img src="Dibujo_006.jpg" /></div>
<div class="Lapiz Anime"><img src="Dibujo_007.jpg" /></div>
<div class="Boligrafo Anime"><img src="Dibujo_008.jpg" /></div>
<div class="Creyon Anime"><img src="Dibujo_009.jpg" /></div>
Pero fíjense como las imágenes todas tienen iguales o diferentes categorías entre si, bueno, si yo solo quiero ver las imágenes de "Animal" entonces selecciono "Animal", si quiero ver "Personas" selecciono "Personas" y si quiero ver dos o mas a la vez solo selecciono "Animal" y "Lapiz" por ejemplo.
El problema de este código es que no funciona de manera correcta con dos o mas categorias.
En fin, quisiera ver si hay alguien que me pueda dar este código ya echo, si no es mucha molestia
Pero que funcione al menos con las seis categorias que les di arriba. Y no olviden el código .js
Ok... Creo que fue mucho pedir. Pueden decirme entonces exactamente que busco.? Porque ya googlee lo mas que pude y eso fue lo mas que conseguí.
Me pueden ayudar en algo.??
MOD: No hacer doble post. Usa el botón modificar.
En línea
