em
Responsive Slideshows

Responsive Slideshows

Responside Design

Responsive Design é um conceito que visa apresentar a informação de forma confortável e acessível para qualquer dispositivo, ou seja, você pode acessar um site no PC e o mesmo no iPhone, por exemplo, onde a marcação HTML continua a mesma, mas através do CSS são feitas adaptações no layout que tornam sua navegação confortável. No momento não vou entrar muito em detalhes sobre esse assunto, só queria deixar aqui o conceito para aqueles que desconhecem essa técnica.

O intuito desse post é mostrar o conceito de Responsive Design aplicado a Slideshows, como você pode ver nos mesmos listados abaixo:

Blueberry

Plug-in para jQuery experimental voltado para layouts fluidos.

Blueberry

FlexSlider

Slideshow com opções de fade e slide, além de suporte a touch gestures.

FlexSlider

PhotoSwipe

Slideshow criado visando especificamente os dispositivos móveis.

PhotoSwipe

Slides

Mais um plugin para jQuery com recursos de looping e reprodução automática.

Slides

Responsive jQuery slideshow

Um simples slideshow desenvolvido com jQuery para demonstrar o poder do Responsive Design

Responsive jQuery slideshow

Responsive Carousel

Plugin de carousel voltado para Responsive Layouts.

Responsive Carousel

Elastislide

Plugin de carousel voltado para Responsive Layouts com suporte a Touche gestures.

Elastislide

Comentários

  1. Parabéns pelo post, testei todas muito boa essas galerias.

    por Tiago Responder
  2. opaw cara show de bola hein! depois do Elastislide a codrops postou esse aqui http://tympanus.net/Tutorials/ResponsiveImageGallery/

    por Rodrigo de Melo Responder
  3. Salvou a pátria o/

    por Rubens Cavalheiro Responder
  4. Uma das técnicas, é chamada de Media Query, onde você monta um CSS pra determinado tamanho de tela, maior que 320px, ou menor que 480px por exemplo.
    Diego Eis fala sobre o assunto no blog dele, http://tableless.com.br/introducao-sobre-media-queries/

    por Ângelo — Responder
  5. Muito bacana essa técnica aplicada a slides. O site http://globotv.globo.com/ está neste formato, achei bem bacana.

    por Diogo Machado Responder

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>