¿Qué estás buscando?

Toca fuera o pulsa Esc para cerrar

Slider de noticias automático

Ejemplo histórico de slider de noticias, con criterios actuales de accesibilidad, rendimiento y control por parte del usuario.

Este recurso Javascript puede ser muy útil para potenciar la imagen de las últimas noticias y contenidos. Había visto cosas parecidas en Flash con XML (vease meristation.com), pero sin duda alguna este código me parece mucho más versátil. Podéis ver una demo aquí: Ver Contenido Y descargarlo desde el archivo adjunto.

- Archivo Adjunto: fcslider.zip

Actualización y contexto

Contenido revisado el 24 de agosto de 2026.

El ZIP original continúa disponible en Kaosconcept y permite estudiar cómo se resolvían estos componentes con jQuery. Para un proyecto nuevo conviene tratarlo como material histórico: un carrusel automático puede dificultar la lectura, desplazar el foco y provocar cambios de diseño inesperados.

Qué debería tener una versión actual

  • Botones reales para avanzar, retroceder, pausar y reanudar.
  • Etiquetas accesibles y un orden de foco previsible para teclado.
  • Pausa al situar el puntero o el foco dentro del componente.
  • Respeto por prefers-reduced-motion y ausencia de transiciones imprescindibles para comprender el contenido.
  • HTML inicial con titulares y enlaces rastreables, sin depender de JavaScript para descubrir las noticias.

Si el contenido cambia automáticamente, debe existir tiempo suficiente para leerlo y una forma clara de detenerlo. Antes de reutilizar el código descargado, revisa su versión de jQuery, elimina dependencias que ya no necesites y prueba el componente en móvil, con teclado y con JavaScript desactivado.

6 comentarios

  1. Estudio Dnova

    Muchisimas gracias!! justo estaba buscando este slider

    Reportar este comentario

  2. Alberto

    muy bueno, gracias.

    Reportar este comentario

  3. Dulce

    Muchas gracias!!! es muy practico Pero ahora ¿como lo coloco dentro de una pagina...o un blog? ¿Se puede colocar nadamas el codigo o hay algun truco para esto?

    Reportar este comentario

  4. Galax

    Es genial , Gracias por el tutorial me ha servido muchísimo , felicitaciones por su trabajo It's great, Thanks for the tutorial has helped me very much, congratulations on your work

    Reportar este comentario

  5. Marcos

    exelente slider me a gustado...

    Reportar este comentario

  6. Ricky

    Excelente.....!!!!! Fácil, rápido y sobretodo limpio :) Felicitaciones (y)

    Reportar este comentario

Deja un comentario

Información básica de protección de datos. Responsable: Miguel Ángel Ruiz Carmona (Websmultimedia). Trataremos el nombre y el comentario para gestionar y publicar tu aportación a petición tuya, y para moderarla y prevenir abusos por interés legítimo. El email es opcional, nunca se publica y se elimina 90 días después de moderar. El alojamiento se presta en la UE y no cedemos estos datos salvo obligación legal. Puedes ejercer tus derechos en miguel@websmultimedia.com. Consulta la información de privacidad y las normas de participación.