Ejercicios resueltos

Simulador (Cuando presiona el botón "ejecutar el programa" se graban todos los cuadros de texto y se ejecuta el primero de la lista mostrando en una página el resultado.)

Confeccionar una página que muestre un recuadro con texto. Disponer dos botones, uno que cambie la opacidad lentamente hasta el valor 0.5 y el otro que lo muestre lentamente hasta el valor 1.

pagina1.html

<!DOCTYPE html>
<html>

<head>
  <title>Ejemplo de jQuery</title>
  <meta charset="UTF-8">
  <link rel="StyleSheet" href="estilos.css" type="text/css">
</head>

<body>
  <input type="button" id="boton1" value="Reducir opacidad">
  <input type="button" id="boton2" value="Aumentar opacidad">
  <div id="descripcion" class="recuadro">
    <p>HTML es el lenguaje que se emplea para el desarrollo de páginas
      de internet.</p>
    <p>Este lenguaje está constituido de elementos que el navegador interpreta
      y las despliega en la pantalla de acuerdo a su objetivo. Veremos que hay elementos
      para disponer imágenes sobre una página, hipervínculos que
      nos permiten dirigirnos a otra página, listas, tablas para tabular datos, etc.</p>
    <p>Para poder crear una página HTML se requiere un simple editor
      de texto (en nuestro caso emplearemos este sitio) y un navegador de internet (IExplorer,
      FireFox etc.), emplearemos el navegador que en este preciso momento está
      utilizando (recuerde que usted está viendo en este preciso momento una
      página HTML con su navegador).</p>
    <p>Lo más importante es que en cada concepto desarrolle los ejercicios
      propuestos y modifique los que se presentan ya resueltos.</p>
    <p>Este curso lo que busca es acercar el lenguaje HTML a una persona que
      nunca antes trabajó con el mismo. No pretende mostrar todas los elementos
      HTML en forma alfabética.</p>
    <p>Como veremos, de cada concepto se presenta una parte teórica,
      en la que se da una explicación completa, luego se pasa a la sección
      del ejercicio resuelto donde podemos ver el contenido de la página HTML
      y cómo la visualiza el navegador. Por último y tal vez la sección
      más importante de este tutorial es donde se propone que usted haga páginas
      en forma autónoma (donde realmente podrá darse cuenta si el concepto
      quedó firme).</p>
  </div>

</html>

funciones.js

estilos.css

22 - Efecto con el método fadeTo.

Retornar