jQuery interface


Please make sure that the following calls are after/within the jQuery Ready event.

Simplest plugin call


Place the following code anywhere you prefer



Ajaxifies the whole site, dynamically replacing the div with the ID ‘#content’ across pages

If several divs should be swapped, just specify their IDs like this:
jQuery('#content, #nav').ajaxify();
The plugin can take an arbitrary amount of IDs, however the first one should specify the main content div

Options default values

/* basic config parameters */
    selector : "a:not(.no-ajaxy)", //Selector for elements to ajaxify - without being swapped - e.g. a selection of links
    forms : "form:not(.no-ajaxy)", // jQuery selection for ajaxifying forms - set to "false" to disable
    canonical : true, // Fetch current URL from "canonical" link if given, updating the History API.  In case of a re-direct...
    refresh : false, // Refresh the page if clicked link target current page

/* visual effects settings */
    requestDelay : 0, //in msec - Delay of Pronto request
    aniTime : 0, //in msec - must be set for animations to work
    aniParams : false, //Animation parameters - see below.  Default = off
    previewoff : true, // Plugin previews prefetched pages - set to "false" to enable or provide a jQuery selection to selectively disable
    scrolltop : false, // Always scroll to top of page
    idleTime: 0, //in msec - master switch for slideshow / carousel - default "off"
    slideTime: 0, //in msec - time between slides
    menu: false, //Selector for links in the menu
    addclass: "jqhover", //Class that gets added dynamically to the highlighted element in the slideshow
    toggleSlide: false, //Toggle slide parameters - see below.  Default = off

/* script and style handling settings, prefetch */
    deltas : true, // true = deltas loaded, false = all scripts loaded
    inline : true, // true = all inline scripts loaded, false = only specific inline scripts are loaded
    inlinehints : false, // strings - separated by ", " - if matched in any inline scripts - only these are executed - set "inline" to false beforehand
    inlineskip : "adsbygoogle", // strings - separated by ", " - if matched in any inline scripts - these are NOT are executed - set "inline" to true beforehand 
    inlineappend : true, // append scripts to the main content div, instead of "eval"-ing them
    style : true, // true = all style tags in the head loaded, false = style tags on target page ignored
    prefetch : true, // Plugin pre-fetches pages on hoverIntent or touchstart

/* debugging & advanced settings*/
    verbosity : 0,  //Debugging level to console: default off.  Can be set to 10 and higher (in case of logging enabled)
    memoryoff : false, // strings - separated by ", " - if matched in any URLs - only these are NOT executed - set to "true" to disable memory completely
    cb : null, // callback handler on completion of each Ajax request - default null
    pluginon : true // Plugin set "on" or "off" (==false) manually

Demo of visual effects below

Animation parameters (aniParams)

Default ist false (set off).
You can turn them on, by setting aniTime and passing some parameters, that override these defaults:

These will only be applied to the main content div!

    opacity: 1, //no fade, set to 0 for maximum fade
    width: "100%", //in percent -  "100%" means no change
    height: "100%" //in percent -  "100%" means no change

Other animation parameters

You can specify any parameters that are understood by .animate()

Slideshow parameters

Please set idleTime and slideTime (in milliseconds)

Toggle slideshow parameters (toggleSlide)

Default ist false (set off).
You can turn them on, by passing some parameters, that override these defaults:

{ //defaults - if not turned off completely
    parentEl: '#content', //parent element selector, where the above image(s) will be prepended - a different value might be e.g. "article:first" 
    imgOn: '', 
    imgOff: '', 
    titleOn: 'Turn slideshow off', //title tag when on
    titleOff: 'Turn slideshow on', //title tag when off
    imgProps: { marginLeft: '85%', marginTop: '20px' } //style attributes of img

Public methods

Jump to an internal page programmatically:

Access the XHR object of the $.ajax() call

53 thoughts on “Interface”

  1. Hello Arvind,

    I’m testing the newest version of the ajaxify and my links get triggered on hover. How can I stop this. I want my users to click on links in order to access pages.


  2. Ajaxify is not working with bootstrap for special onload classes.

    like i want to use selectpicker with ajaxify its doesnt work.

    Please help me to do it.

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright 2005-2016, All rights reserved.
Latest update: 18. October 2016