Available Options


Notice: Use of undefined constant php - assumed 'php' in /home/jarodcore/prod.meerkat.jarodtaylor.com/wp-content/themes/meerkat-default/template-documentation.php on line 11

Notice: Use of undefined constant php - assumed 'php' in /home/jarodcore/prod.meerkat.jarodtaylor.com/wp-content/themes/meerkat-default/template-documentation.php on line 12

Notice: Use of undefined constant php - assumed 'php' in /home/jarodcore/prod.meerkat.jarodtaylor.com/wp-content/themes/meerkat-default/template-documentation.php on line 13
background

The background option accepts CSS background (shorthand) property values.

Example: background: '#000 url(/path/to/bgimage.jpg) no-repeat left top'

Default: background: 'none'

opacity

If opacity option is declared, meerkat will append an opacity layer, mirroring your background setting, but with transparency. This will not effect the opacity of the content, only the opacity background layer.

Example: opacity: '0.75'

Default: opacity: null

height

The height option accepts all CSS height property values (px, em, %, auto, etc).

Example: height: '75px'

Default: height: 'auto'

width

The width option accepts all CSS width property values (px, em, %, auto, etc).

Example: width: '500px'

Default: width: '100%'

position

The position setting will determine where Meerkat enters from and exits to. The available options are top, bottom, left, or right.

Example: position: 'left'

Default: position: 'bottom'

close

The hide option attaches to an html element selector (ie. ".hide" or "#hide").

Example: close: '#hide-popup'

Default: close: '.hide'

dontShowAgain

The dontShowAgain option attaches to an html element selector (ie. ".dont-show" or "#dont-show"). Much like the hide option, this will remove Meerkat from the page, however, this also sets a cookie in the users browser telling it not to show Meerkat again. Depending on the cookieExpires setting, Meerkat will not show again for a set amount of days, or until the browser session ends (browser restarts).

Example: dontShowAgain: '#dont-show-meerkat'

Default: hide: '#dont-show'

cookieExpires

If you use the dontShowAgain option, you can set the amount of days Meerkat will not show for. This option accepts whole numbers beginning with 0. Each number represents a day. If it's set to 0, Meerkat will not show again until that user's browser session has ended (browser restarts).'

Example: cookieExpires: 7

Default: cookieExpires: 0

removeCookie

By giving an HTML element a class or id that is assigned to the removeCookie option, users can click this element and the 'meerkat' cookie will be removed, allowing for meerkat to show again.

Example: removeCookie: '.reset'

Default: removeCookie: '.removeCookie'

animationIn

This option accepts 'fade', 'slide', and 'none'. This will effect how Meerkat shows itself.

Example: animationIn: 'fade'

Default: animationIn: 'slide'

animationOut

This option accepts 'fade', 'slide', and 'none'. This will effect how Meerkat hides itself.

Example: animationIn: 'fade'

Default: animationIn: 'slide'

animationSpeed

The animationSpeed option accepts the following values: ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000)

When animationSpeed is set to a number; The number represents the duration of the sliding/fading animation (in milliseconds). The smaller the value, the faster the animation.

Example: animationSpeed: 500

Default: animationIn: 'normal'

delay

This option accepts a whole number representing seconds. Setting this option's value to '2' will delay Meerkat from showing for 2 seconds.

Example: delay: 2

Default: delay: 0

timer

This option accepts a whole number representing seconds. Setting this option's value to '5' will hide Meerkat automatically 5 seconds after it's appeared, without needing the user to click your hide element.

Example: timer: 5

Default: timer: null

dontShowAgainAuto

This option accepts true or false.

This method works along side the timer method. If set to true, after Meerkat automatically closes, the dontShowAgainAuto will trigger the dontShowAgain method, which creates a cookie in the user's browser telling it not to show Meerkat again. Depending on the cookieExpires setting, Meerkat will not show again for a set amount of days, or until the browser session ends (browser restarts).

Example: dontShowAgainAuto: true

Default: dontShowAgainAuto: false

onMeerkatShow

The onMeerkatShow option is a callback function, an opportunity to add additional customization to Meerkat.

Example: onMeerkatShow: function(){ $(this).animate({opacity: 'show'}) }

Default: onMeerkatShow: (an empty function)

easingIn

The use of this option requires the jQuery Easing Plugin by George Smith. Coupled with the animationIn option, you have numerous choices for the easing of its animation. These options will not do anything without making reference to the jQuery Easing plugin BEFORE your jQuery Meerkat reference.

Example: easingIn: 'easeInBounce'

Default: easingIn: 'swing'

easingOut

The use of this option requires the jQuery Easing Plugin by George Smith. Coupled with the animationOut option, you have numerous choices for the easing of its animation. These options will not do anything without making reference to the jQuery Easing plugin BEFORE your jQuery Meerkat reference.

Example: easingOut: 'easeOutBounce'

Default: easingOut: 'swing'

Destroy Meerkat

Using the destroyMeerkat() method will remove all of meerkat's wrappers and containers, leaving (but hiding) its contents.

Example:

$('.destroy).click(function(){
	$('#meerkat').destroyMeerkat();
});