paginação de botões e imagens com jcycle
Olá amigos como vão?
Talvez minha pergunta seja infantil e de fácil resolução mas o que eu encontrei em minhas pesquisas não foi o suficiente para que eu resolvesse o meu problema . Bem é o seguinte estou desenvolvendo um site de filmes em que a paginação de categoria seria um slide para cada categoria, e dentro desse slide as informações de vários filmes correspondentes. No caso eu fiz os botões para cada categoria e gostaria de que quando clicasse no botão fosse exibido o slide correspondente. O problema persistiria quando fosse linkar a imagem do filme com a descrição correspondente que seria exibida.
Até agora consegui implantar o plugin jcycle e linquei aos botões o problema é que aparecem a numeração do paginador dentro de cada botão e a chamada só é feita se clicar no número do botão.
Gostaria se possível que alguem pudesse me dar a solução por favor.
aqui está como se encontra até o momento para terem uma ideia do que fiz:
no mozila não aparece o slide somente no chrome outra questão a se resolver.
Estes são os botões que criei cada um com uma categoria diferente:
> <div class="centro">
<ul class="menu">
<li><a href="#"><div class="botao">Lançamentos</div></a></li>
<li><a href="#"><div class="botao">Terror</div></a></li>
<li><a href="#"><div class="botao">Comédia</div></a></li>
<li><a href="#"><div class="botao">Romance</div></a></li>
</ul>
</div>
e aqui ficam os slide(páginas das categoris correspondentes).
> <div class="centro2">
<ul>
<li>
<div id="lancamentos"> <img src="imagens/Somos Tão Jovens.jpg" width="224" height="320" />aqui o conteudo lançamentos</div>
</li>
<li>
<div id="terror"> oi<img src="imagens/Um Caso Complicado.jpg" width="260" height="365" /> aqui o conteudo terror</div>
</li>
<li>
<div id="comedia"> <img src="imagens/umaladrasemlimites.jpg" width="250" height="350" />aqui o conteudo comedia</div>
</li>
<li>
<div id="romance"><img src="imagens/Ze Colmeia - O Filme.jpg" width="229" height="320" /> aqui o conteudo romance</div>
</li>
</ul>
</div>
Acredito que o css não é necessário no entanto aqui mostro como faço a chamada do script.
> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<script type="text/javascript">
$(function(){
$(".centro2 ul").cycle({
fx:'scrollLeft',
speed: 500,
timeout: 200000,
pager:'.botao',
})
})
</script>
Como faço para que o slide mude com o clicar do botão correspondente criado e como seria o mesmo processo caso em vez dos botões fosse utilisado imagens?
desde já agraço pela ajuda! no aguardo...
Discussão (6)
Carregando comentários...