jQuery NavigationBar

Set the theme property of the jqxNavigationBar. Author: http://jqwidgets.com

HTML

<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<input type='button' value='replace original content' onClick='navigationBar()' />

<div id="jqxWidget">
    <div id="window">
        <div id="windowHeader">window header</div>
        <div style="overflow: hidden;" id="windowContent">
            <div id='windowContentEmbedded'>this is marks test</div>
        </div>
    </div>
</div>
<div style='display: none; visibility: hidden;' id='jqxNavigationBar'>
    <div>part one header</div>
    <div>part one body
        <br />more part one body</div>
    <div>part two header</div>
    <div>part two body
        <br />more part two bodyasfas asdf asdf asdf asdf asdf asdf asdf asdf asdf asdf asdf asdf asdf as</div>
    <div>part three header</div>
    <div>part three body
        <br />more part three body</div>
</div>

JavaScript

var basicDemo = (function () {
            function _addEventListeners() {};

            function _createElements() {};

            function _createWindow() {
                $('#window').jqxWindow({
                    showCollapseButton: true,
                    maxHeight: 200,
                    maxWidth: 700,
                    minHeight: 200,
                    minWidth: 200,
                    height: 300,
                    width: 500,
                    initContent: function () {
                        $('#window').jqxWindow('focus');
                    }
                });
            };
            return {
                config: {
                    dragArea: null
                },
                init: function () {
                    _createElements();
                    _addEventListeners();
                    _createWindow();
                }
            };
        }());
        $(document).ready(function () {
            //Initializing the demo
            basicDemo.init();
            navigationBar();
        });

function navigationBar() {   
   $tmp = $('<div>' + $('div#jqxNavigationBar').html() + '</div>');
   $($tmp).jqxNavigationBar({
         width: 400,
   });
  $('div#windowContentEmbedded').html($tmp);
}