Navigation with AJAX I haven't used AJAX a lot, but what I want to do is the following:

I have a top navigation that outputs entries from a structure which link to various singles that display my data.
I want my navigation to stay and not reload when going to another page. How would I implement AJAX combined with Craft for that?
I'm not sure this is a really a Craft-specific question, but here's a basic strategy:


Build your nav and pages to work without any Ajax calls. Make sure your nav is output consistently (e.g. in &lt;nav class="primary-nav") as well as the content of the page (e.g. in &lt;div class="main"&gt;). 
Now implement your JavaScript. You want to (a) intercept navigation link clicks to stop a full page reload, (b) Ajax in the new content, (c) move the active class to the clicked navigation link, and (d) change the URL to the new page address. Make sure to use History.js to smooth out any difference in browser implementation of HTML5's history API (including pushState).


Here's a demo (and code) I cooked up with static HTML. It's based on Andrew Fricke's post titled Rolling your own PJAX Implementation with History.js