this is the code I use to call ajax posts in the same page.
It’s works fine but when the post is load the slideshow in the post (add via short code) is not showing….
the ajax call
jQuery('#menu-profilo > li > a').click(function(event){
//This keeps the href from reloading the page
event.preventDefault();
//grab the page link
var page = jQuery(this).attr('href');
jQuery('#slideshow').html ('<div id="loading"><p>loading</p></div>')
//use the grabbed link in the load function
.load(page+' .post_content').fadeIn(2000)
});
This is the post load in ajax :
https://www.dropbox.com/s/za0jwx7sdm2z6zx/post.jpg
the post load normally (no ajax call) works fine.
The problem is the jquery plugin royalslider ( or other plugin, is the same) that
seems not working.
here firebug image:
https://www.dropbox.com/s/iui14sxqm4xwa1d/post2.jpg
the white space is the the royal slider section….
How Can I fix this?
I mean when I load a post via ajax call to show the post and the jquery plugin…
When you load a page that contains a normal static post, there is some JavaScript that is called on page load to instantiate your slider. Something like:
This finds all of the elements that should have a slider applied and runs all the necessary code to set it up and make it all work.
When you load content via AJAX, that code has already run and won’t automagically apply the slider to your newly loaded content. After your AJAX content is added to the page, any JavaScript manipulation of that content has to be called again.