Slide que eu quero - vi num video

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Slide que eu quero - vi num video

Mensagem por MayconMaximiano em 28/01/13, 03:49 am

Qual é minha questão:
OI- Galera eu estou querendo um slideshow bacana para meu fórum.
apenas quero todo o html do slide css  tudo junto ja pronto com algumas imagens sem preferencias ( depois eu apenas troco as imagens ).
01:55 o cara monstra um slide dahora ( quero aquele tipo )
com botões 1,2,3,4,5,6  abaixo dos slides, e com proximo e anterior dos outros lados.

VIDEO DO SLIDE QUE EU QUERO [url=]http://www.youtube.com/watch?v=HkcleQMnuqU[/url]
Pare o video em 1:55 ele monstra slide  *-*.

Preciso do mais rápido possivel amigos, agradeço desde já.

Esse meu fórum

http://llinfinitoll.123.st/forum

PHPBB3    xD.
OBG.

Endereço do meu fórum:
http://llinfinitoll.123.st

Versão do fórum:
PHPBB3
avatar

MayconMaximiano
Nível 2

Masculino
Inscrito dia : 27/01/2013
Mensagens : 8
Pontos Ativos : 16

Ver perfil do usuário http://llinfinitoll.123.st/

Resolvido Re: Slide que eu quero - vi num video

Mensagem por iPrompt em 28/01/13, 09:41 am

Olá,

Aqui o código do slide

<script type="text/javascript">
channel(1);
</script>
</div><div id="”slide”"><img title="”#”" src="”suaimagem.jpg”" alt="”#”" /></div>
<img title="”#”" src="”sua" alt="”#”" width="”900px”" height="”300px”" />
<a href="seulink"><img src="suaimagem" title="#" alt="#"></a>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.cycle/2.99/jquery.cycle.all.min.js"></script><script type="text/javascript"> $(document).ready(function(){ $('#slide').cycle({ fx: "fadeZoom", next: '#next', prev: '#prev', speed: 1200, timeout: 1200 }); }); ></script><div id="slide"><img title="#" src="http://ideiasemrede.com/projetos/GeraSlide/img/img1.jpg" alt="#" /> <img title="#" src="http://ideiasemrede.com/projetos/GeraSlide/img/img2.jpg" alt="#" /> <img title="#" src="http://ideiasemrede.com/projetos/GeraSlide/img/img3.jpg" alt="#" /> <img title="#" src="http://ideiasemrede.com/projetos/GeraSlide/img/img4.jpg" alt="#" /></div> <div id="naveg"><a id="next" href="#">Proxima</a> <a id="prev" href="#">Anterior</a></div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery.cycle/2.99/jquery.cycle.all.min.js"></script>

Depois adiciona este código em sua Folha de estilo CSS

Código:
#slide{width:900px; height:300px; position:relative; overflow:hidden; margin:0 auto;} #slide img{width:900px; height:300px; z-index:5;} #next {width:80px; height:60px; position:absolute; left:0; text-decoration:none; background-color:#333; text-align:center; line-height:60px; color:#fff; font-weight:bold; z-index:300; } #prev {width:80px; height:60px; position:absolute; right:0; text-decoration:none; background-color:#333; text-align:center; line-height:60px; color:#fff; font-weight:bold; z-index:300; } #naveg{width:960px; height:60px; position:relative; top:-190px; z-index:50; margin:0 auto; }

Lembrando para que o slide funcione corretamente precisa ter o plugin cycle instalado corretamente

Até
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum