jBox Demo

by Michael Baas

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/StephanWagner/[email protected]/dist/jBox.all.min.css">
<script src="https://cdn.jsdelivr.net/gh/StephanWagner/[email protected]/dist/jBox.all.min.js"></script>
<button onclick="createContent()">Create Content</button>

CSS

body {
  font-family: sans-serif;
}

.tt {
  width: 200px;
  background: #eee;
  margin: 5px 0;
  padding: 5px;
}

JavaScript

var myTip;

function initTips() {
	if (!myTip) {
  	myTip = new jBox('Tooltip',{getContent: "data-jbox-content"});
  }
  myTip.attach();
}

function createContent() {
	$('<div class="tt" data-jbox-content="Hello world"/>').html('Click me!').appendTo($('body'));
  initTips();
}