Question

I have a jQuery script which is ideal for loading different secions of a web page with some easing effects. Basically each section has a unique id and one section shows while the others are hidden with css. And when loading a new section the content will appear with a nice transition, I’m sure you know the type.

The script also supports loading (external) content via ajax (ie another page), so I could load the page external.html within my site. The problem is, links within the ajaxed content on a new page do not work. The script works by using a selector, wrapped around the links which are to produce the transition effects. For example the script is initialised in this way:

$(document).ready(function (){  
  //Usage
  $("#menu ul li").slidingPage({
        easing : 'easeInOutQuint',
        speed : 800,
        slideScroll : 'horizontal', 
        top : 0, 
        navigation: {
            show: false,
            nestedPagesFlows: true
        }
  });
}); 

And everything in #menu ul li will produce the effects, even on the external page. I am having trouble, however, with links in the actual content of the external page.

I have a very rudimentary example here snipped. The “about” section is located within the home page, it’s not a separate page, so if you click to about and then press the home link in the section content, it will take you back to the home page. If you go to the external page, which is obviously a separate page, and press the home link in the content, it does not work, yet the home link in the menu does 😐

I have tried a second function for the ajaxed content links, but so far no luck! All I would like to do is specify an a class that would work in the external content and allow navigation around the site from there, rather than just from the menu.

Any help would be appreciated, thanks for looking.

Answer 1

Change this line to this

<a class="shoots" href="#homepage" rel="homepage" title="home">Home</a>

basically your href was wrong. You need to include href=”#homepage” in your external link home page href.
Hope it helps.