Este é um guest post enviado por Irison Andrade para o RBtech Developer.
Nesta aula irei ensinar como criar um slide de imagens utilizando o CoinSlider e jQuery. Acompanhe a aula e veja como é fácil e simples criar seu próprio slide para melhorar o seu site ou portal.
(link indisponível)
Gostou da aula? Tem alguma dúvida ou quer deixar uma sugestão? Comente logo abaixo...
Compartilhe esse post:Este autor é um voluntário, que além de acompanhar o blog participa enviando conteúdos para serem publicados. Participe você também!
Atualmente temos 20 comentários para este post. Participe você também, clique aqui e comente sobre o assunto.
Teria como alterar a posiçao da barra de navegacao que fica na parte inferior do slide??
Gostaria de coloca-la no topo ou do lado, ou mesmo desativa-la.
Obrigado.
postando o codigo fonte corretamente
<div id='coin-slider'>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_0_acai.jpg'>
<span>
<b>Aa</b><br/>
Aa uma palmeira do norte do Brasil e, entre os indgenas, conhecido como "i-a", a fruta que chora. Sendo tpica da Amaznia, espalha-se por toda a regio, chegando ao Maranho, Guiana e Venezuela.
</span>
</a>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_1_castanha.jpg'>
<span>
<b>Castanha do Brasil</b><br/>
Fruto da castanheira, rvore de porte magnfico e dimenses notveis, com tronco de at 4 metros de dimetro e que chega a alcanar 50 metros de altura. As castanhas, frutas da castanheira, so comestveis e muito saborosas.
</span>
</a>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_2_cupuacu.jpg'>
<span>
<b>Cupuau</b><br/>
O cupuau uma rvore de porte mdio, nativa da Amaznia, que passou a ser cultivada em quase todo o Brasil. Os sabonetes e a loo possuem extrato de Cupuau, que promove ao hidratante, emoliente, condicionante e remineralizante.
</span>
</a>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_3_guarana.jpg'>
<span>
<b>Guaran</b><br/>
O guaranazeiro uma planta nativa da Amaznia, produz o fruto conhecido como guaran, espcie vegetal arbustiva e trepadeira da famlia das sapindceas, cujo nome provm do termo indgena "varana", que significa rvore que sobe apoiada em outra. Cultivado inicialmente, na Amaznia pelos ndios maus.
</span>
</a>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_4_copaiba.jpg'>
<span>
<b>Copaba</b><br/>
A copaba (Copaifera sp) fornece o blsamo ou leo de copaba, um lquido transparente e teraputico, que a seiva extrada mediante a aplicao de furos no tronco da rvore at atingir o cerne.</span>
</a>
<a href="http://www.perolanativa.com.br" target="_blank">
<img src='images/banner_5_breubranco.jpg'>
<span>
<b>Breu-Branco</b><br/>
O Breu Branco (protium pallidum) uma rvore da floresta amaznica, que ao sofrer alguma agresso como uma picada de inseto libera uma seiva branca e brilhante como forma de defesa que tambm chamada de breu-branco.</span></a><script type="text/javascript">
$(document).ready(function() {
$('#coin-slider').coinslider({ width: 472, heigth: 200, navigation: false, delay: 8000 });
});
</script></div></td>
Irison e Ricardo, boa tarde!
Estou tentando usar este slider em meu site dentro de um determinado espaço, Porém quando coloco o slider no lugar que ele deverá ficar na página perco toda a desconfiguração, será que poderia me ajudar a como não perder a configuraçao, já redefini o tamanho das imagens e tudo porém não fica corretamente, abaixo segue o código que estou usando.
Obs. a div meio e onde ficara o slider.
Código fonte excluído pois não foi postado conforme as regras dos comentários
obrigado.
Gilmar Oliveira
ResponderNossa cara muito boa sua VA, parabens.
Testei e já usei em um job.
http://www.wellingtonsilva.net/mudanca/
Muito obrigado.
Wellington Silva
ResponderParabéns mesmo cara por ter seguido a vídeo aula e ter empregado o conteúdo com inteligência em um projeto. Pois a maioria dos comentários que eu recebo são de pessoas dizendo ter seguido o vídeo e não conseguiram fazer. Você provou que quem segue o vídeo com atenção é capaz de reproduzir perfeitamente e fazer um bom emprego do material.
ResponderIrison Andrade, parabéns pela V.A, muito bem explicada tudo certo, estou estudando php+mysql, em breve pretendo desenvolver V.A para compartilhar o conhecimento, valeu mesmo um forte abraço!
ResponderÓtima vídeo-aula ficou tudo certo. Deu alguns erros, mas depois funcionou perfeitamente e fiquei muito feliz.
ResponderEstou seguindo os passos porém não consegui. Fica normal: as fotos na esquerda, o título e a descrição do lado. Não está como Slide. Mas vou tentar arrumar.
SlideShow
Teste 1
Lorem Ipsum é simplesmente texto aleatório da indústria da impressão e tipografia. Lorem Ipsum foi o texto padrão da indústria manequim desde os anos 1500.
Teste 2
Lorem Ipsum é simplesmente texto aleatório da indústria da impressão e tipografia. Lorem Ipsum foi o texto padrão da indústria manequim desde os anos 1500.
Teste 3
Lorem Ipsum é simplesmente texto aleatório da indústria da impressão e tipografia. Lorem Ipsum foi o texto padrão da indústria manequim desde os anos 1500.
Teste 4
Lorem Ipsum é simplesmente texto aleatório da indústria da impressão e tipografia. Lorem Ipsum foi o texto padrão da indústria manequim desde os anos 1500.
$(document).ready(function() {
$('#coin-slider').coinslider({ width: 860, height:300,effect:random, navigation: true, delay: 5000 });
});
Como faço para publicar minha foto nos comentários?
ResponderVocê precisa fazer um cadastro com seu email no site gravatar.com e colocar a imagem que você quiser lá. Automaticamente irá aparecer nos comentários de praticamente todos os blogs.
Responderalguem tem os arquivos pra postar aqui pra gente... vlewwww
ResponderJoão, os arquivos estão no post e estão baixando normalmente... testei diversas vezes e não tive problemas com o download...
ResponderOutro detalhe, o que está no download são apenas as imagens, creio que não seja tão difícil fazer algumas imagens para testes...
Respondermuito boa mesmo essa video aula parabens continua assim ok cara
ResponderFala ai Irison blza?
Ja usei o coinslider em um projeto que participei, http://sbot-mg.org.br/
no inicio ele funciona normalmente, mas se eu trocar de aba dai um pouco se eu voltar no site os slides estão passando bem rapido, voce tem ideia de como resolver isso?
Obrigado
Olha Breno, eu acessei teu site e não identifiquei esse problema que você citou, quando eu mudo de aba e volto os slides estão normais. No site do desenvolvedor tem umas indicações sobre algumas funções que se inseridas de forma inadequada atrapalha o funcionamento dos slides tanto é que o desenvolvedor aconselha usar por sua conta e risco talvez seja isso.
Respondernao da pra fazer o download dos arquivos.
ResponderEstá normal o download dos arquivos aqui.
ResponderÓtima aula, bem interessante
cada vídeo se aprende um pouquinho mais
Parabéns.
© 2008-2024 - RBTech.info | Todos os direitos reservados | Hospedado por Innova Host
É proibida a reprodução total ou parcial de qualquer conteúdo deste site.
Acompanho sempre as videos aulas, aprendo bastante, Obg por colaborar.
Quero usar esse script com + mysql mas me deparo com o seguinte problema.
Quando chamo a imagem no banco de dados ela fica reduzida, já usei estilizei no css e nada faz ficar do tamanho desejado.
Outro problema apresentado foi a imagem se repetir, já consegui corrigir editando os scripts inserindo
'background-repeat': 'no-repeat',.
Em outros scripts como jcarousel e easySlider, consigo trabalhar com Banco dados normalmente, se alguém puder me ajudar, agradeço.