How to make use of it:

1. Load the primary script and core stylesheet within the doc.

<link rel="stylesheet" href="/path/to/jdoor/jdoor.css" />
<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jdoor/jdoor.js"></script>

2. Create a moveable window on the display screen utilizing the next parameters:

// $(targetscreenId).jdCreateWindow(windowId, x, y, width, height, title, content)
$('#targetContainer').jdCreateWindow('my_window_id', 100,100, 'dyn', -50, "A window", "This is <br />just<br /> a<br /> window. <div style='width:40px; height:40px; background-color: #FA0;'></div>");

3. Embed a Youtube video into the moveable Window.

// $(targetscreenId).jdCreateYoutubeWindow(windowId, x, y, width, height,title, youtubeid)
$('#targetContainer')jdCreateYoutubeWindow('youtube_window', 100,150, 200,'dyn',"Youtube Window", "8Ltr_IkvKmc");

4. Show & cover the moveable Window.

// show a window
$(windowId).jdShow();

// remove all windows
$(targetscreenId).jdHideAllWindows();

5. Replace the content of a window.

$(windowId).jdHTML(html);

6. Override the default types of the window.

.jdwindow {
  border: 2px solid #FC2C25;
  background-color: #222222;
  color: #FFF;
  font-family: 'Roboto';
  font-size: 12px;
}

.jdwindow-top { 
  background-color: #FC2C25; 
  padding-left: 5px;
}

.jdwindow-hide{
  background-color: #911;
  font-size: 16px;
  text-align: center;
}