drag and drop an object

I can't figure out how to drag and drop. I've followed some tutorials but no success. I use Firefox as my browser. Any tutorial you would recommend?
I found this tutorial:
http://luke.breuer.com/tutorial/javascript-drag-and-drop-tutorial.aspx
But it still doesn't work.

<div style="border: 1px solid rgb(124, 124, 124); margin: 0px auto; position: absolute; left: 400px; top: 140px; text-align: center; z-index: 4; width: 500px; background-color: rgb(80, 80, 80);">
	<span class="drag" style="border-style: solid; border-color: rgb(165, 164, 152); border-width: 1px 1px 0px; background-color: rgb(124, 124, 124); width: 498px; height: 30px;">
		<span style="padding: 2px 1px 2px 5px; float: left; color: rgb(255, 255, 255); font-weight: bold;">Write Your Comments - Best Viewed On Firefox</span>
		<span style="float: right;">
			<a href="javascript: cancelCommentsPopup();" style="text-decoration: none;" onmouseout="document.getElementById('closebtn').style.backgroundColor = '#7C7C7C';" onmouseover="document.getElementById('closebtn').style.backgroundColor = '#A5A498';">
				<span id="closebtn" style="border: 1px solid rgb(165, 164, 152); float: left; width: 25px; height: 25px; color: rgb(255, 255, 255); background-color: rgb(124, 124, 124);"> X </span>
			</a>

		</span>
	</span>

HTML:

and
js file
Error: _debug is null
Source File: http...twotexts/js/drag.js
Line: 29