Ejercicio

[XD2XD2]

Hola, yo he aprendido javascript aqui [URL="http://www.javascriptya.com.ar/"]http://www.javascriptya.com.ar/[/URL] Se todo lo que sale en esa web menos los array.

Hago este post para ver si me podeis poner como una especie de ejercicio para yo hacerlo.

Lo que quiero saber es si he aprendido javascript o solo me e memorizado todo sin entender nada.

¿podeis ponerme como una especie de ejercicio para que yo os lo haga?

[3nr1c]

Si dices que aún no has manejado a hacer arrays, yo de tí los aprendería primero porque se suelen usar bastante...

Pero si quieres empezar a hacer algo, podrías crear un script para un menú desplegable:

Código HTML:

<div class="nivel1">Parent 1</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
<div class="nivel1">Parent 2</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
 

La idea es que al hacer clic en los elementos "parent 1" y "parent 2" se vean los div de nivel dos (solo el correspondiente), es decir primero tienen que estar ocultos.

No es solo de Javascript también de HTML y CSS pero es que javascript solo como que mucha utilidad no tiene si no vas a usar Node...

Un saludo

[XD2XD2]

Iniciado por 3nr1c

Si dices que aún no has manejado a hacer arrays, yo de tí los aprendería primero porque se suelen usar bastante...

Pero si quieres empezar a hacer algo, podrías crear un script para un menú desplegable:

Código HTML:

<div class="nivel1">Parent 1</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
<div class="nivel1">Parent 2</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
 

La idea es que al hacer clic en los elementos "parent 1" y "parent 2" se vean los div de nivel dos (solo el correspondiente), es decir primero tienen que estar ocultos.

No es solo de Javascript también de HTML y CSS pero es que javascript solo como que mucha utilidad no tiene si no vas a usar Node...

Un saludo

Mira [URL="http://www.forosdelweb.com/f13/dejar-marcada-seleccion-hacer-clic-1034041/"]http://www.forosdelweb.com/f13/dejar-marcada-seleccion-hacer-clic-1034041/[/URL]

Yo se html, css (Pero tengo poco estilo para diseñar, se me da mal), php, javascript (Ya he temrinado el tutorial), jquery (Estoy empezando)

Eso es lo que se utilizar pero en php y en javascript se me dan mal los array (Un poquito si se pero lo minimo). en jquery no se si abra array todavia no he llegao.

[XD2XD2]

Iniciado por 3nr1c

Si dices que aún no has manejado a hacer arrays, yo de tí los aprendería primero porque se suelen usar bastante...

Pero si quieres empezar a hacer algo, podrías crear un script para un menú desplegable:

Código HTML:

<div class="nivel1">Parent 1</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
<div class="nivel1">Parent 2</div>
<div class="nivel2">
<ul><li>Elemento1</li><li>Elemento2</li></ul>
</div>
 

La idea es que al hacer clic en los elementos "parent 1" y "parent 2" se vean los div de nivel dos (solo el correspondiente), es decir primero tienen que estar ocultos.

No es solo de Javascript también de HTML y CSS pero es que javascript solo como que mucha utilidad no tiene si no vas a usar Node...

Un saludo

Jquery:

Código Javascript:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(iniciar);
 
function iniciar(){
$("#1").mouseover(ocultar);
$("#2").mouseout(mostrar);
}
 
function ocultar(){
$("#2").removeAttr("hidden", "false");
$("#2").Attr("hidden", "false");
}
 
function mostrar(){
$("#2").attr("hidden", "true");
}
</script>
<style text="text/css">
#button {
padding: 0;
}
 
 
#button li {
display: inline;
}
 
#button li a {
font-family: Arial;
font-size:11px;
text-decoration: none;
float:left;
padding: 10px;
background-color: #2175bc;
color: #fff;
}
 
#button li a:hover {
background-color: #2586d7;
margin-top:-2px;
padding-bottom:12px;
}
</style>
<div id="Info"></div>
<ul id="button">
    <li><a id="1" href="#">Home</a>
        <a id="2" hidden="true">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Clients</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">F.A.Q</a></li>
    <li><a href="#">Help</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>
 

Javascript:

Código Javascript:

<style text="text/css">
#button {
padding: 0;
}
 
 
#button li {
display: inline;
}
 
#button li a {
font-family: Arial;
font-size:11px;
text-decoration: none;
float:left;
padding: 10px;
background-color: #2175bc;
color: #fff;
}
 
#button li a:hover {
background-color: #2586d7;
margin-top:-2px;
padding-bottom:12px;
}
</style>
 
<ul id="button">
    <li><a onmouseover="document.getElementById('1').hidden=false" href="#">Home</a>
        <a href="#" id="1" onmouseout="this.hidden=true" hidden>Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Clients</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">F.A.Q</a></li>
    <li><a href="#">Help</a></li>
    <li><a onmouseover="document.getElementById('2').hidden=false" href="#">Contact Us</a>
        <a href="#" id="2" onmouseout="this.hidden=true" hidden>Home</a></li>
</ul>
 

Estaria bien no?