Jquery cycle e ajax
Olá pessoal, estou tendo problemas com o jquery cycle depois que chamo outro slide via ajax no lugar do primeiro. Vou explicar melhor e colocar uma imagem.
Preciso fazer isso:
O slide 1 já está no index, quando clico no slide 2 ou 3 ele chama seu outro respectivo slide via ajax:
<script type="text/javascript">
$(document).ready(function(){
$(".jsEscolha a").click(function( e ){
e.preventDefault();
var href = $( this ).attr('href');
$("#trocaSlideJS").load( href +"#trocaSlideJS");
});
});
</script>
Jquery Cycle:
<script type="text/javascript">
$(document).ready(function(){
//CONF SLIDE
$('#imagens ul').cycle({
fx: 'fade',
speed: 2000,
timeout: 5000,
next: '#prox',
prev: '#ant',
pager: '#pager'
});
});
</script>
HTML:
<h1>INDEX SEM REFRSH</h1>
<div id="imagens">
<div id="trocaSlideJS">
<ul>
<li>
<img src="https://s-media-cache-ak0.pinimg.com/originals/c5/53/7d/c5537d0e8aa31d595a612aae578d2e06.jpg" alt="imagem01" title="imagem01" width="600" height="300" />
</li>
<li>
<img src="http://4.bp.blogspot.com/-J-v5eIxTkwU/UN4sUKWetyI/AAAAAAAAAOk/03TWVVn0iSY/s1600/WallPaper-HD-3160.jpg" alt="imagem02" title="imagem02" width="600" height="300" />
</li>
<li>
<img src="http://cdn.pcwallart.com/images/california-palm-trees-tumblr-background-wallpaper-2.jpg" alt="imagem03" title="imagem03" width="600" height="300" />
</li>
</ul>
<div class="pag">
<a href="#" id="ant">anterior</a>
<span id="pager"></span>
<a href="#" id="prox">próximo</a>
</div>
</div>
</div>
<div class="jsEscolha">
<button><a href="index.html">slide01</a></button>
<button><a href="slides/slide2.html">slide02</a></button>
<button><a link="slide03.html">slide03</a></button>
</div>
Quando clico no slide 2 , o ajax chama a id="trocaSlideJS" do slide 2 mas o cycle para de funcionar.
O console não mostra muita coisa. Vou deixar o arquivo aqui pra quem quiser se aprofundar: [slides.zip](/applications/core/interface/file/attachment.php?id=1620)
Por que não está funcionando? Dês de já agradeço.Discussão (1)
Carregando comentários...