Just call the cycle
initializer manually in your callback:
$(".container").load("step2.html", function() {
$('.cycle-slideshow').cycle();
});
Domanda
I'm trying to initiate JQuery cycle on external HTML content loaded in with Ajax, but this doesn't seem to work:
$(".container").load("step2.html", function() {
$.fn.cycle.defaults.autoSelector = '.cycle-slideshow';
});
the html is as follows:
<div class="cycle-slideshow second-prize-slider" data-cycle-manual-speed="2000" data-cycle-slides="p" data-cycle-timeout=5000 >
<p>Jetzt<br />mitmachen & <br />gewinnen</span></p>
<p >Täglich<br>mitspielen & <br> Gewinnchance<br> steigern!</p>
</div>
Soluzione
Just call the cycle
initializer manually in your callback:
$(".container").load("step2.html", function() {
$('.cycle-slideshow').cycle();
});
Altri suggerimenti
Yes it works only if you add $
symbol in a jQuery(document).ready(function($)
and make your functions global to call them inside you ajax call:
jQuery(document).ready(function($) {
window.script_cycle = function() {
$('.cycle-slideshow').cycle();
}
// the function below if you want to add or change some attributes to your cycle
window.cycle_attr = function() {
$('.cycle-slideshow').cycle({
fx: 'fade',
speed: 1500,
});
}
});
JQuery(document).ready(function() {
$.ajax({
url: 'http://yoururl.com',
data: { param : value }, // if youre using http://yoururl.com?param=value
success: function(data){
script_cycle(); // global function from previous document.ready to be called here
}
});
// if youre using load same procedure here
$(".container").load("step2.html", function() {
script_cycle();
});
});
Seems to be a bug from the plugin the need for $ in the document ready, but using this procedure worked for me, Cheers!.