Blog do MX Cursos

5 modelos gratuitos de sliders para seu site

5 modelos gratuitos de sliders para seu site
5 modelos gratuitos de sliders para seu site
5 (100%) 1 voto[s]

Os Sliders são recursos incríveis que dão um toque de otimização e requinte em seus sites, blogs e e-commerce. Aqui mesmo neste blog, temos um recurso de Slider que oferece aos nossos leitores um espaço compactado e de destaque para veiculação de conteúdos recentes.

Neste artigo listarei 5 scripts de Sliders gratuitos que vão incrementar mais seus projetos.

Continue lendo.

SlidesJS

SlidesJS Sliders

Este Slider é incrível. Bem simples, prático e ainda responsivo. Possui dois tipos de navegação: Por setas e bullets. Se adapta a diversos tipos de projetos.

[su_button url=”http://slidesjs.com/” target=”blank” style=”flat” background=”#6CAB5E” icon=”icon: cloud”]Ver exemplo do Slider[/su_button] [su_button url=”https://github.com/nathansearles/Slides/archive/SlidesJS-3.zip” target=”blank” style=”flat” background=”#0099CC” icon=”icon: plus”]Baixar código do Slider[/su_button] [su_divider top=”no”]

FlexSlider

FlexSlider

Também responsivo, este Slider tem uma pegada bastante moderna. Desenvolvido em jQuery, seu código permite diversas configurações e customizações como alterar os efeitos de transição. É possível veicular imagens e vídeos. Suas setas ocultas que surgem à presença do ponteiro do mouse sobre a imagem é um charme a mais.

[su_button url=”http://flexslider.woothemes.com/” target=”blank” style=”flat” background=”#6CAB5E” icon=”icon: cloud”]Ver exemplo do Slider[/su_button] [su_button url=”https://github.com/woothemes/FlexSlider/zipball/master” target=”blank” style=”flat” background=”#0099CC” icon=”icon: plus”]Baixar código do Slider[/su_button] [su_divider top=”no”]

Elastic Slider

Elastic Slider

Tem um design bem peculiar e uma composição bem moderna. Este Slider além de responsivo, tem um detalhe importante: Permite inclusão de textos em sua composição visual, e mais: Permite animações e efeitos de transição nesses textos. Sua navegação ocorre por squares que exibem thumbnails ao passar a seta do mouse.

Ainda oferece 2 modelos distintos: Um com e outro sem autoplay.

[su_button url=”http://tympanus.net/Tutorials/ElasticSlideshow/index.html” target=”blank” style=”flat” background=”#6CAB5E” icon=”icon: cloud”]Ver exemplo do Slider[/su_button] [su_button url=”http://tympanus.net/Tutorials/ElasticSlideshow/ElasticSlideshow.zip” target=”blank” style=”flat” background=”#0099CC” icon=”icon: plus”]Baixar código do Slider[/su_button] [su_divider top=”no”]

Blueberry

Blueberry Slider

Simplicidade. Esta é a palavra que descreve o Slider Blueberry. Com uma pegada minimalista e composição flexível por ser responsivo, tem um efeito de transição em fade. Peca no tamanho dos bullets de navegação, mas dependendo do projeto, pode se adequar facilmente.

Dica do redator: Quer se especializar ou potencializar suas habilidades em HTML5, CSS3, Javascript, jQuery, Bootstrap, entre outros? Conheça todos nossos Cursos Online de Desenvolvimento Front-End em Vídeo Aulas.
[su_button url=”http://marktyrrell.com/labs/blueberry/” target=”blank” style=”flat” background=”#6CAB5E” icon=”icon: cloud”]Ver exemplo do Slider[/su_button] [su_button url=”http://marktyrrell.com/labs/blueberry/jquery.blueberry.zip” target=”blank” style=”flat” background=”#0099CC” icon=”icon: plus”]Baixar código do Slider[/su_button] [su_divider top=”no”]

Slidorion Sliders

Slidorion

Ideal para projetos como portais de conteúdo, portais de jornalismo, etc. Infelizmente, não é responsivo, mas sua navegação ocorre por camadas que se sobrepõem sobre a outra. Bem interessante.

Possui uma documentação com diversas possibilidades de efeitos e customizações.

[su_button url=”http://slidorion.com/” target=”blank” style=”flat” background=”#6CAB5E” icon=”icon: cloud”]Ver exemplo do Slider[/su_button] [su_button url=”https://github.com/hollandben/Slidorion/archive/master.zip” target=”blank” style=”flat” background=”#0099CC” icon=”icon: plus”]Baixar código do Slider[/su_button] [su_divider top=”no”]

E aí? Gostou das dicas? Já usa ou usou algum desses Sliders? Conhece outros scripts interessantes? Deixe seu comentário.

Ah, e como de costume, compartilha esse conteúdo com seus contatos.

Felipe Cardozo

Felipe Cardozo

Felipe Cardozo é fundador e professor do MX Cursos. Também é publicitário e criador do MX Masters e Video Aulas Brasil, ama tecnologia e como filho de pais professores, não poderia deixar de ser: Compartilha imediatamente tudo que aprende!

Clube de Cursos

Conheça nosso Clube de Cursos e potencialize suas habilidades em Produção e Edição de Vídeos, Design, Marketing Digital, Programaço, WordPress, 3D e Modelagem, Motion Graphics e muito mais!

CONHEÇA O CLUBE

Your Header Sidebar area is currently empty. Hurry up and add some widgets.