Edit in JSFiddle

var obj = document.getElementById('drag-1'),
    obj2 = document.getElementById('drag-2');
		
viiny.dragger(obj, {
  activeClass: 'active-drag'
});
	
viiny.dragger(obj2, {
	restrict: document.getElementById('restrict_obj')
});
<div id="drag-1" class="draggable box">
    You can drag this
</div>

<div id="restrict_obj">
  <div id="drag-2" class="draggable box orange">
    Drag Me
  </div>
</div>
.draggable {
	position: absolute;
	left: 0;
	top: 0;
  z-index: 999;
}

.box {
	width: 100px;
	height: 100px;
	padding: 10px;
	font-size: 12px;
	text-align: center;
	background-color: #23527c;
	color: #FFFFFF;
	word-wrap: break-word;
}

.active-drag {
  opacity: 0.7;
}

#restrict_obj {
  width: 300px;
  height: 200px;
  left: 300px;
  border: 1px solid #ccc;
}

External resources loaded into this fiddle: