Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 5 de 5

Tema: como utilizar en el Html el Plugin de jquery

  1. #1
    Recien Llegado! Merodeador
    Fecha de Ingreso
    05 nov, 12
    Mensajes
    4
    Poder de Reputación
    0

    como utilizar en el Html el Plugin de jquery

    holaaa
    Soy nueva en el uso de jquery y de ahí mi pregunta. ¡¡¡si alguien me puede ayudar!!!!
    Me he descargado el plugin de jquery v1.8.2 y ahora necesito aplicarlo en el HTML, mi intención es hacer un slider con paginación pero no doy con ello.
    gracias de antemano..........

  2. #2
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    02 may, 11
    Ubicación
    Santiago, Chile
    Mensajes
    2,045
    Poder de Reputación
    21
    Hola:

    Antes que nada: ¿cuánto sabes de programación en Javascript o, en su defecto, jQuery? Si la respuesta es nada, entonces va a ser difícil entender lo que te podamos explicar :). Lo mejor que puedes hacer es comenzar por el tutorial de Javascript que existe en CCTW. Necesitas aprender a pensar con lógica para poder desarrollar tu misma un plugin (además de conocer el lenguaje de programación).

    Si no entiendes algo del tutorial, entonces no dudes en preguntar en el foro, de lo contrario no avanzarás mucho :).

    Saludos.

  3. #3
    Recien Llegado! Merodeador
    Fecha de Ingreso
    05 nov, 12
    Mensajes
    4
    Poder de Reputación
    0
    gracias por tu pronta contestación....
    el caso es que hasta ahora todo lo he hecho con html puro y duro de dreamweaver y las animaciones las hacía en Flash y con gifs de photoshop, pero claro, el flash ya nada con eso del castigo de Google y como parece que con jquery es muy fácil quiero ponerme a ello.
    por eso preguntaba como hacer ese slider con paginación, he encontrado en http://jquery.malsup.com/cycle/pager.html el efecto que deseo hacer y el código que me marca es:
    $('#slideshow').before('<div id="nav">').cycle({ fx: 'turnDown', speed: 'fast', timeout: 3000, pager: '#nav' });

    y aunque no lo entiendo, no consigo aplicarlo en el html para que funcione

    .....
    <script type="text/javascript" src="jquery.cycle.all.js"></script>

    <script type="text/javascript">
    $('#slideshow').before('<div id="nav">').cycle({
    fx: 'scrollLeft',
    speed: 'fast',
    timeout: 3000,
    pager: '#nav'
    });
    </script>

    </head>

    después he realizado en el body:
    <body>
    <div id="slideshow">
    <img src="images/receptivo1.jpg" alt="Cuenca" />
    <img src="images/receptivo2.jpg" alt="Cuenca" />
    <img src="images/receptivo3.jpg" alt="Cuenca" />
    <img src="images/receptivo4.jpg" alt="Cuenca" />
    <img src="images/receptivo5.jpg" alt="Cuenca" />
    <img src="images/receptivo6.jpg" alt="Cuenca" />
    <img src="images/receptivo7.jpg" alt="Cuenca" />
    </div>

    y sólo consigo que salga una imagen debajo de otra.

    espero haberme explicado bien y gracias de nuevo

  4. #4
    Recien Llegado! Merodeador
    Fecha de Ingreso
    05 nov, 12
    Mensajes
    4
    Poder de Reputación
    0
    perdón

    donde pone "aunque no lo entiendo..." quise decir que SI lo entiendo

  5. #5
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    02 may, 11
    Ubicación
    Santiago, Chile
    Mensajes
    2,045
    Poder de Reputación
    21
    Aaaaaaaaaaah, ok... en ese caso, tu problema es que primero debes incluir la librería jQuery. Tienes que aprender a diferenciar entre un plugin, que añade funcionalidad al lenguaje o librería, y una librería, que da la funcionalidad básica para hacer "algo".

    En fin... siempre que utilices un plugin de jQuery debes incluir la librería antes de utilizar el plugin:

    Código:
    <html>
      <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script><!-- Esta línea incluye la librería jQuery -->
        <script type="text/javascript" src="jquery.cycle.all.js"></script><!-- Esta línea incluye el plugin jQuery que quieres utilizar
        <script type="text/javascript">
          jQuery(document).ready(function($) { // Con esta línea te aseguras que el script se ejecute cuanto todo el contenido se haya cargado
            $('#slideshow').before('<div id="nav">').cycle({ // Aquí utilizas el plugin
              fx: 'scrollLeft',
              speed: 'fast',
              timeout: 3000,
              pager: '#nav'
            });
          });
        </script>
      </head>
      <body>
        <div id="slideshow">
          <img src="images/receptivo1.jpg" alt="Cuenca" /> 
          <img src="images/receptivo2.jpg" alt="Cuenca" />
          <img src="images/receptivo3.jpg" alt="Cuenca" />
          <img src="images/receptivo4.jpg" alt="Cuenca" />
          <img src="images/receptivo5.jpg" alt="Cuenca" />
          <img src="images/receptivo6.jpg" alt="Cuenca" />
          <img src="images/receptivo7.jpg" alt="Cuenca" />
        </div>
      </body>
    </html>
    Ahora intenta ver el resultado.

Temas Similares

  1. moving boxes plugin jquery
    Por danieltra en el foro Curso de jQuery
    Respuestas: 3
    Último Mensaje: 23/08/2012, 20:07
  2. Respuestas: 1
    Último Mensaje: 22/08/2012, 10:32
  3. Respuestas: 0
    Último Mensaje: 04/05/2011, 15:43
  4. ¿Se puede utilizar HTML-KIT en un mac?
    Por ITM en el foro Foro General
    Respuestas: 2
    Último Mensaje: 15/02/2011, 05:56
  5. TENGO MAC Y NO PUEDO UTILIZAR HTML KIT
    Por WILCO en el foro Foro General
    Respuestas: 1
    Último Mensaje: 03/10/2008, 21:50

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •