{"main":["navigation.js","navigation.css"],"options":[{"name":"customClass","type":"string","default":"''","description":"Class applied to instance"},{"name":"gravity","type":"string","default":"'left'","description":"Gravity of 'push', 'reveal' and 'overlay' navigation; 'right', 'left'"},{"name":"label","type":"boolean","default":"true","description":"Display handle width label"},{"name":"labels.closed","type":"string","default":"'Menu'","description":"Closed state text"},{"name":"labels.open","type":"string","default":"'Close'","description":"Open state text"},{"name":"maxWidth","type":"string","default":"'980px'","description":"Width at which to auto-disable plugin"},{"name":"type","type":"string","default":"'toggle'","description":"Type of navigation; 'toggle', 'push', 'reveal', 'overlay'"}],"events":[{"name":"open.navigation","description":"Navigation opened"},{"name":"close.navigation","description":"Navigation closed"}],"methods":[{"name":"close","description":"Closes instance.","examples":["$(\".target\").navigation(\"close\");"]},{"name":"defaults","description":"Extends plugin default settings; effects instances created hereafter.","params":[{"name":"options","type":"object","default":"{}","description":"New plugin defaults"}],"examples":["$.navigation(\"defaults\", { ... });"]},{"name":"destroy","description":"Removes plugin instance.","examples":["$(\".target\").navigation(\"destroy\");"]},{"name":"disable","description":"Disables instance.","examples":["$(\".target\").navigation(\"disable\");"]},{"name":"enable","description":"Enables instance.","examples":["$(\".target\").navigation(\"enable\");"]},{"name":"open","description":"Opens instance.","examples":["$(\".target\").navigation(\"open\");"]}],"name":"Navigation","type":"widget","description":"A jQuery plugin for simple responsive navigation.","dependencies":["core.js","mediaquery.js","swap.js","touch.js"],"css":[{"name":".fs-navigation-element","type":"element","description":"Target elmement"},{"name":".fs-navigation","type":"element","description":"Base widget class"},{"name":".fs-navigation-toggle-nav","type":"element","description":"Toggle navigation"},{"name":".fs-navigation-toggle-nav.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-toggle-nav.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-toggle-handle","type":"element","description":"Toggle handle"},{"name":".fs-navigation-toggle-handle.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-toggle-handle.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-overlay-nav","type":"element","description":"Overlay nav"},{"name":".fs-navigation-overlay-nav.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-overlay-nav.fs-navigation-animated","type":"modifier","description":"Indicates animated state"},{"name":".fs-navigation-overlay-nav.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-overlay-left-nav","type":"modifier","description":"Indicates left hand nav"},{"name":".fs-navigation-overlay-right-nav","type":"modifier","description":"Indicates right hand nav"},{"name":".fs-navigation-push-nav","type":"element","description":"Push nav"},{"name":".fs-navigation-push-nav.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-push-nav.fs-navigation-animated","type":"modifier","description":"Indicates animated state"},{"name":".fs-navigation-push-nav.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-push-left-nav","type":"modifier","description":"Indicates left hand nav"},{"name":".fs-navigation-push-right-nav","type":"modifier","description":"Indicates right hand nav"},{"name":".fs-navigation-reveal-nav","type":"element","description":"Reveal nav"},{"name":".fs-navigation-reveal-nav.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-reveal-nav.fs-navigation-animated","type":"modifier","description":"Indicates animated state"},{"name":".fs-navigation-reveal-nav.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-reveal-left-nav","type":"modifier","description":"Indicates left hand nav"},{"name":".fs-navigation-reveal-right-nav","type":"modifier","description":"Indicates right hand nav"},{"name":".fs-navigation-overlay-handle","type":"element","description":"Overlay handle"},{"name":".fs-navigation-overlay-handle.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-push-handle","type":"element","description":"Push handle"},{"name":".fs-navigation-push-handle.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-overlay-content:before","type":"element","description":"Overlay mask"},{"name":".fs-navigation-overlay-content.fs-navigation-open:before","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-push-content","type":"element","description":"Target page content"},{"name":".fs-navigation-push-content.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-push-content.fs-navigation-animated","type":"modifier","description":"Indicates animted state"},{"name":".fs-navigation-push-content.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-push-left-content","type":"modifier","description":"Indicates left hand nav"},{"name":".fs-navigation-push-right-content","type":"modifier","description":"Indicates right hand nav"},{"name":".fs-navigation-reveal-content","type":"element","description":"Target page content"},{"name":".fs-navigation-reveal-content.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-reveal-content.fs-navigation-animated","type":"modifier","description":"Indicates animted state"},{"name":".fs-navigation-reveal-content.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-reveal-left-content","type":"modifier","description":"Indicates left hand nav"},{"name":".fs-navigation-reveal-right-content","type":"modifier","description":"Indicates right hand nav"},{"name":".fs-navigation-handle","type":"element","description":"Click target to toggle navigation"},{"name":".fs-navigation-handle.fs-navigation-open","type":"modifier","description":"Indicates open state"},{"name":".fs-navigation-handle.fs-navigation-enabled","type":"modifier","description":"Indicates enabled state"},{"name":".fs-navigation-handle:after","type":"element","description":"Icon displayed in handle"},{"name":".fs-navigation-lock","type":"modifier","description":"Indicates locked state; Applied to body element"}],"use":"### Basic\n\nNavigation will automatically turn a basic navigation into a mobile friendly system. Links can be styled independently:\n\n```javascript\n$(\"nav\").navigation();\n```\n\n```markup\n<h4 id=\"handle\">Navigation</h4>\n<nav data-navigation-handle=\"#handle\">\n\t<a href=\"#\">Home</a>\n\t<a href=\"#\">About</a>\n\t<a href=\"#\">Contact</a>\n</nav>\n```\n\n### Breakpoint\n\nBy default, Navigation will enable itself on screens smaller then 980 pixels wide. Specify a different width by setting the `maxWidth` option on initialization.\n\n```javascript\n$(\"nav\").navigation({\n\tmaxWidth: \"740px\"\n});\n```\n\n### Slide Out\n\nNavigation can also slide out from the left or right hand side of the screen. The nav can 'push' the main page content by specifying the `data-navigation-content` attribute:\n\n```javascript\n$(\"nav\").navigation();\n```\n\n```markup\n<h4 id=\"handle\">Navigation</h4>\n<nav data-navigation-handle=\"#handle\" data-navigation-content=\"#content\">\n\t<a href=\"#\">Home</a>\n\t<a href=\"#\">About</a>\n\t<a href=\"#\">Contact</a>\n</nav>\n<div id=\"content\">\n\t...\n</nav>\n```\n\n<h3>Events</h3>\n\nReact to the navigation by listening for the `open.navigation` and `close.navigation` events:\n\n```javascript\n$(\"nav\").on(\"open.navigation\", function() {\n\t// ...\n}).on(\"close.navigation\", function() {\n\t// ...\n});\n```\n\n### IE Support\n\nWhen supporting IE, a [HTML5 enabler](https://gist.github.com/benplum/8045366) and matchMedia polyfill ([IE 8](https://gist.github.com/benplum/8045336), [IE 9](https://gist.github.com/benplum/8045327)) are required.","demo":"<style>\n\t.navigation { margin: 0 0 20px; overflow: hidden; }\n\t.navigation a { background: #c65032; border: none; color: #fff; display: block; float: left; font-size: 16px; line-height: 40px; margin: 0 1px 0 0; padding: 0 20px; }\n\t.navigation a:hover { color: #fff; }\n\n\t.navigation.fs-navigation-enabled a { float: none; margin: 0 0 1px 0; width: 100%; }\n\t.navigation.fs-navigation-enabled { padding: 10px; }\n\n\t.nav_buttons { margin: 0 0 20px; }\n\t.nav_buttons .active,\n\t.no-touch .nav_buttons .active:hover { background: #c65032; }\n\t@media screen and (min-width: 500px) {\n\t\t.nav_buttons .button { margin: 0 10px 0 0; width: 160px; }\n\t}\n</style>\n\n<script>\n\t$(function() {\n\t\t$(\".navigation a\").on(\"click\", function(e) {\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t});\n\n\t\t$(\".navigation\").navigation();\n\n\t\t$(\".nav_switch\").on(\"click\", function() {\n\t\t\t$(\".nav_buttons .button\").removeClass(\"active\");\n\t\t\t$(this).addClass(\"active\");\n\n\t\t\t$(\".main_nav\")\n\t\t\t\t.navigation(\"destroy\")\n\t\t\t\t.attr(\"data-navigation-options\", \"{}\")\n\t\t\t\t.removeData(\"navigation-options\")\n\t\t\t\t.navigation({\n\t\t\t\t\ttype: $(this).data(\"type\"),\n\t\t\t\t\tgravity: $(this).data(\"gravity\"),\n\t\t\t\t\tmaxWidth: \"10000px\"\n\t\t\t\t});\n\t\t});\n\t});\n</script>\n\n<h4>Basic</h4>\n<h5 id=\"nav_handle_1\">Navigation</h5>\n<nav class=\"navigation\" data-navigation-handle=\"#nav_handle_1\">\n\t<a href=\"#\">Home</a>\n\t<a href=\"#\">About</a>\n\t<a href=\"#\">Contact</a>\n</nav>\n\n<h4>Breakpoint</h4>\n<h5 id=\"nav_handle_2\">Navigation</h5>\n<nav class=\"navigation\" data-navigation-handle=\"#nav_handle_2\" data-navigation-options='{\"maxWidth\":\"740px\"}'>\n\t<a href=\"#\">Home</a>\n\t<a href=\"#\">About</a>\n\t<a href=\"#\">Contact</a>\n</nav>\n\n<h4>Sidecar</h4>\n<div class=\"nav_buttons\">\n\t<button type=\"button\" class=\"button nav_switch\" data-type=\"overlay\" data-gravity=\"left\">Overlay Left</button>\n\t<button type=\"button\" class=\"button nav_switch active\" data-type=\"overlay\" data-gravity=\"right\">Overlay Right</button>\n</div>\n<div class=\"nav_buttons\">\n\t<button type=\"button\" class=\"button nav_switch\" data-type=\"reveal\" data-gravity=\"left\">Reveal Left</button>\n\t<button type=\"button\" class=\"button nav_switch\" data-type=\"reveal\" data-gravity=\"right\">Reveal Right</button>\n</div>\n<div class=\"nav_buttons\">\n\t<button type=\"button\" class=\"button nav_switch\" data-type=\"push\" data-gravity=\"left\">Push Left</button>\n\t<button type=\"button\" class=\"button nav_switch\" data-type=\"push\" data-gravity=\"right\">Push Right</button>\n</div>\n\n<!--\n<br>\n<button type=\"button\" class=\"button js-nav_handle\">Toggle Navigation</button>\n-->\n\n<!--\n<h4>Overlay</h4>\n<h5 id=\"nav_handle_3\">Navigation</h5>\n<nav class=\"navigation\" data-navigation-handle=\"#nav_handle_3\" data-navigation-options='{\"type\":\"overlay\"}'>\n\t<a href=\"#\">Home</a>\n\t<a href=\"#\">About</a>\n\t<a href=\"#\">Contact</a>\n</nav>\n-->"}