webnoticias, publicación de artículos gratis, participación ciudadana, notas de prensa
Publicar es gratis, sólo tienes que registrarte y escribir.
  Usuario: Clave:    
 
 
Expresate a tu manera. Dejá que los demás se encarguen de malentenderte   por    
Documento sin título
 
Documento sin título
 
Documento sin título
 
Documento sin título
 
Documento sin título
Home
Xnechijli01 10/23/2019 10:53:56 PM
Xnechijli01
Menú Dinámico de página web
Código para menú Dinámico de página web
votos 0 comentarios 0 enviar vínculo a un amigo
Tags JavaScript
 
Generación de menú Dinámico con código de javascript
 

Esta nota es la conclusión de la sección de menú para cambiar el fondo de tu página con JavaScript. Esto como parte de nuestro curso de JavaScript. Ahora continuamos hablando de este tema. 

Crea una variable para representar el objeto seleccionado. El truco document.getElementById() funciona aquí al igual que para los campos de texto. Ahora extrae la propiedad de valor del objeto seleccionado, el cual refleja el valor de la opción seleccionada actualmente. Entonces, si el usuario ha elegido Amarillo, el valor de selColor es "#FFFF00". Claro que cada sección indica el color que mostrará? Por eso, puedes modificar de acuerdo a tu gusto este código. Pero no olvides usar los números hexadecimales correpondientes al color mencionado. 

Para establecer el color de fondo del documento usa el mecanismo DOM para establecer el color de fondo del cuerpo al valor elegido. Ahora te incluimos el código final. 

<html>
 <head>
  <script type = "text/javascript">
  // from dropdownList.html
  function changeColor(){
  var selColor = document.getElementById("selColor");
  var color = selColor.value;
  document.body.style.backgroundColor = color;
  } // end function
 </script>
 </head>
 <body>
 <form action = ">
  <h1>Please select a color</h1>
  <fieldset>
  <select id = "selColor">
   <option value = "#FFFFFF">White</option>
   <option value = "#FF0000">Red</option>
   <option value = "#FFCC00">Orange</option>
   <option value = "#FFFF00">Yellow</option>
   <option value = "#00FF00">Green</option>
   <option value = "#0000FF">Blue</option>
   <option value = "#663366">Indigo</option>
   <option value = "#FF00FF">Violet</option>
  </select>
  <input type = "button"
    value = "change color"
    onclick = "changeColor()" />
  </fieldset>
 </form>
 </body>
</html>

 Ahora que tienes la base para formar menús desplegable con javascript que modifican fondo de pantalla puedes cambiar la apariencia de tu sitio. Eso contribuirá a darle una vista diferente. Espera siguientes notas para ampliar tu comprensión del tema. También puedes hacerlo dinámico si decides construirlo usando PHP. Por eso te recomendamos que veas nuestro curso de PHP y también te puede ayudar nuestro curso de Kotlin
 

Te gustó esta nota, compártela con tus amigos
ico_copada.gif ico_delicious.png ico_enchilame.gif ico_facebook.png ico_fresqui.gif ico_google.gif ico_meneame.gif ico_myspace.gif ico_technorati.png ico_twitter.gif ico_yahoo.png
Visitá otras notas de Xnechijli01
Bitcoin
 
Comentarios 0  
Enviá tu comentario
Para dejar tu comentario debes ser miembro de webnoticias.
 
Documento sin título
 
Documento sin título
 
Documento sin título
 
Documento sin título
 
 
 
 
Documento sin título
 
Documento sin título
 
Nos contaron qué leen
Documento sin título
 
Documento sin título
 
Documento sin título
 
Documento sin título
 
Documento sin título
 
 
 
Documento sin título
 
Publicar es gratis, sólo tienes que registrarte y escribir.