/*Drag and Drop script for positioned divs and spans */
var maxZdrag = document.getElementsByTagName("div").length;
	maxZdrag += document.getElementsByName("span").length;
var dragElem = null;
var dragging = false;



function setDrag(evt,elementID){
	dragElem = getObj(elementID);
	alert(dragElem);
	alert("SA");
	startDrag();
}

function startDrag(){
	dragging = true;
	document.onmousemove=dragObj;
	document.onmouseup=dropObj;
}

function dragObj(evt){
	if(window.event){evt = window.event;}
	if(evt){
		var x = evt.clientX - parseInt( getWidth(dragElem) / 2 );
		var y = evt.clientY - parseInt( getHeight(dragElem) / 2 );
		var z = maxZdrag++;
		shiftTo(dragElem,x,y,z);
		var pos = "drag coordinates are: " + x + ", " + y + ", " + z;
		alert(post);
		window.status=pos;
	}
	return false;
}

function dropObj(){
	dragging = false;
	document.onmousemove=null;
	document.onmouseup = null;
	window.status="";
}
/* End drag and drop script */
</script>

<div id="container">
   <p><img id="view-image" src="images/1.jpg" /></p>
  <ul id="thumbnails">
    	<li class="pic1" onmousedown="setDrag(event,this);" onmouseup="checkdroploc()"><img src="images/1.jpg" /></li>
        <li class="pic2"><img src="images/2.jpg" /></li>
        <li class="pic3"><img src="images/3.jpg" /></li>
        <li class="pic4"><img src="images/4.jpg" /></li>
        <li class="pic5"><img src="images/5.jpg" /></li>
        <li class="pic6"><img src="images/6.jpg" /></li>
  </ul>