Automatic Ajax Navigation
Switch branches/tags
Nothing to show
Pull request Compare This branch is 96 commits behind binarymind:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README
navigate.js

README

---------------------------------------------------------------------
Automatic ajax jquery navigation, mobile friendly (beta)
---------------------------------------------------------------------

The goal of the jQuery plugin Navigate is to

*  Automatically transform regular links into ajax calls (using href, ajax-target, title and ajax-referrer attribute)
*  For mobile browsers, avoid showing address bar on link clicks, smoothing the user experience
*  Enable ajax-onLoad and ajax-onUnload function for each "Page" navigated for having cool transition
*  Manage atomatically the History with those same onload/onunload function if existing

project url : http://www.jquery-css/automatic-ajax-navigation

---------------------------------------------------------------------
BASIC
---------------------------------------------------------------------
simply include your <script type="text/javascript" src="url/to/navigate.js" ></script>
after the include to jquery (1.7+)

/******************************/
/* CAUTION : all js in <head>  /
/******************************/

Navigate will ajax-navigate automaticaly any link :
<a href="myUrl" ajax-target="any selector" ajax-referrer="any selector" title="my title">link</a>

*  href : url to be used by the ajax call
*  title : the future document title
*  ajax-target : (optional) only the content of specified element in href's page will be inserted otherwise all body content
*  ajax-referrer : (optional) the content will be inserted into the referrer element of the current page

Note : by default ajax call will NOT be made if any of the following case is true
---------------------------------------------------------------------
*  target=="_blank"
*  has the class "noAjax"
*  href=="javascript://"
*  href contains "http"
*  rel attribute == "external"

---------------------------------------------------------------------
ADVANCED
---------------------------------------------------------------------

ajax-onload :
---------------------------------------------------------------------
if the "ajax-target" element have an ajax-onload attribute, this javascript code is executed when the content is loaded.
If the ajax-onload is a js function name, this function is called with the given options parameter usable at will :

    {
    referrer : $("body") | $(referrer),
    currentState : state, //Balupton History.js state, See doc
    previousState : state, //Balupton History.js state, See doc
    clickedSelector : selector, //jQuery unique selector of the clicked element
    }

ajax-onunload: 
---------------------------------------------------------------------
if the "ajax-target" element have an ajax-onunload attribute this javascript code will be executed when the user will change the history state.
If the ajax-onunload is a js function name, this function is called with the given options parameter usable at will.

    {
    referrer : $("body") | $(referrer),
    currentState : state, //Balupton History.js state, See doc
    previousState : state, //Balupton History.js state, See doc
    callback : callback, //HAVE TO EXECUTE WHEN UNLOAD COMPLETE options.callback();
    }

---------------------------------------------------------------------
CREDITS
---------------------------------------------------------------------
Use of Modernizr and Balupton History.js (https://github.com/balupton/History.js)