.testcontainer

Basic example using jsPanel and Bootstrap

Loaded resources: jquery, jquery ui, jquery-ui-touch-punch (only needed to support touch actions for jquery ui), jsPanel and Bootstrap (js, css and fonts).
This file does not load third party icon fonts and third party css animations since they are not necessary to use jsPanel.

jsPanel Home: http://jspanel.de/

jsPanel API: http://jspanel.de/api/

jsPanel GitHub: https://github.com/Flyer53/jsPanel

Example 1 creates a naked jsPanel with defaults only:

$.jsPanel();

Example 2 creates a jsPanel with positioning, title and bootstrap theme:

$.jsPanel({
    position:  {
        left: 200,
        top:  100
    },
    title:     'jsPanel bootstrap theme info',
    bootstrap: 'info'
});

Example 3 creates a jsPanel with a header toolbar:

Example 4 creates a jsPanel within .testcontainer and restricts dragging to within .testcontainer:

$.jsPanel({
    selector:  '.testcontainer',
    bootstrap: 'success',
    position:  'center',
    draggable: {
        containment: "parent"
    }
});