Avancerat script?

hello!
Jag har sökt lite på nätet och på wF för att försöka hitta ett litet script, men det går inte så himla bra. :(

Grejjen är att jag via ASPjpeg vill beskära en bild via 'CROP' för det ska man ange lite värden för det

x0, y0, x1, y1

men eftersom det är lite haxx att skriva in dom siffrorna för hand och chansa på att bilden cropas rätt vill jag ha ett litet javascript.
jag vill att bakgrunden i en tabell ska vara Bilden man vill redigera, samtidigt som det över bilden finns något slags DHTML layer som man dra runt över bilden, samt nere i högra hörnet kunna förstora DHTML layern som är omringad av ett streck så man ser vilken del utav bilden man markerar. För att sedan skicka det med formulär vidare till en sida som bearbetar bilden utifrån dom värderna som DHTML layern genererade av något slag.

Någon som förstår vad jag menar?

Okej, jag har lyckats få tag på ett script!
Scriptet används på https://www.playahead.com och jag skickade ett mail till webmastern och fick tillåtelse att använda scriptet! :)
*glad som ett djur*

Men problemet är, att scriptet endast fungerar under Internet Explorer, då undrar jag istället, kan man göra något åt det att det fungerar i fler webläsare än Internet explorer?
Om det inte går, redirecta besökaren till en viss adress

<script>

var dragging = false;
var origX, origY
origX = '';
origY = '';
oldX='';
oldY='';
maxX = '';
maxY = '';
rsHeight = 110;
rsWidth = 90;

var dragging = false;
var resizing = false;

function oo(obj){
	return document.getElementById(obj);
}

function pi(s){
	return parseInt(s)
}

function checkdrag(e) {
	                if(dragging) {
                        var l = document.getElementById(dragging)
                        var ii = document.getElementById('daimage');
                        
                        minX = parseInt(document.getElementById('imDiv').style.left);
                        minY = parseInt(document.getElementById('imDiv').style.top);
                        maxY = minY + parseInt(document.getElementById('daimage').height) - rsHeight -2
                        maxX = minX + parseInt(document.getElementById('daimage').width) - rsWidth
                        thisX = parseInt(l.style.left);
                        thisY = parseInt(l.style.top);
                        
                        						
                        testX = thisX + window.event.clientX - oldX; 
                        testY = thisY + window.event.clientY - oldY;
                        if((testX >=minX) && (testX <maxX  )){
                              l.style.left = testX                        
										oo('userImageX').value = document.getElementById("imDrag").style.pixelLeft - document.getElementById("imDiv").style.pixelLeft;
	                     }
                        if((testY >= minY) && (testY <maxY)){                     
   	                      l.style.top = testY
										oo('userImageY').value = document.getElementById("imDrag").style.pixelTop - document.getElementById("imDiv").style.pixelTop;									 
                        }
                       rePosResizer();
                }
               if(resizing){
                  var l = document.getElementById(resizing)
                  var lc = document.getElementById('imDrag');
                  var li = document.getElementById('spacer');
                  var lr = document.getElementById('imResize');
                 
                  w = l.style.width.split('px')[0];
                  h = l.style.height.split('px')[0];
                  w2 = lc.style.height.split('px')[0];
                  h2 = lc.style.height.split('px')[0];
                  
                  dH = parseInt(window.event.clientX - oldX)
                  dY = parseInt(window.event.clientX - oldX) * (110/90)
                        
                  rsHeight = parseInt(h) + dY;
                  rsWidth = parseInt(l.style.height) * (90/110);

						if (rsHeight < 110) rsHeight = 110;
						if (rsWidth <90) rsWidth = 90;
                 
						maxY = parseInt(document.getElementById('daimage').height) - parseInt(document.getElementById('imDrag').style.top)+58;
						maxX = parseInt(document.getElementById('daimage').width) - parseInt(document.getElementById('imDrag').style.left)+100;
                 if((rsWidth <= maxX) && ( rsHeight <= maxY)){
                        l.style.width = rsWidth
                        l.style.height = rsHeight
                        li.width = l.style.width.split('px')[0];
                        li.height = l.style.height.split('px')[0];
                        lr.style.pixelLeft = window.event.clientX -10;
                        lr.style.pixelTop = window.event.clientY -10;
								oo('userImagex2').value = parseInt(rsWidth)
								oo('userImagey2').value = parseInt(rsHeight)
                  }
//							window.status = rsWidth / rsHeight + ' ::: ' + 90/110
               }

                oldX = window.event.clientX;
                oldY = window.event.clientY;
				   document.body.releaseCapture();
		        return false;
        
}

function dragstart(what) {
		  document.body.setCapture();
        dragging = what
      }

function resizestart(what){	
	    var lr = document.getElementById('imResize');
		 lr.setCapture();
	    resizing = what;
}

function resizestop(){	
   if (resizing){
    var lr = document.getElementById('imResize');
	 lr.releaseCapture();
	 resizing = false;
	 
	}
   rePosResizer();
}

function rePosResizer(){
        var lr = document.getElementById('imResize');
        var lc = document.getElementById('imDrag');
        var l = document.getElementById('imGrid')
        lr.style.pixelLeft = parseInt(lc.style.pixelLeft) + parseInt(l.style.pixelLeft) + parseInt(l.style.width.split('px')[0]);
        lr.style.pixelTop = parseInt(lc.style.pixelTop) + parseInt(l.style.pixelTop) + parseInt(l.style.height.split('px')[0]);
}

function dragstop() {
			document.body.releaseCapture();
        if(dragging) dragging = false;

}

function init()
{
document.onmousemove = checkdrag;
document.onmouseup = dragstop;
document.onclick = resizestop;
}

// end drag/drop routine //

		</script>
		
	    <link href="css/css.css" rel="stylesheet" type="text/css">
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
body,td,th {
	font-size: 10px;
}
.style1 {
	font-size: 14px;
	font-weight: bold;
}
-->
    </style>

<form name="PhotoUpload" method="post" action="photoupload.asp" id="PhotoUpload">
          <div id="Panel2">
            <div id="imDrag" style="Z-INDEX: 4; LEFT: 4px; VISIBILITY: visible; WIDTH: 90px; CURSOR: hand; POSITION: absolute; TOP: 91px; HEIGHT: 110px">
              <div id="imGrid" style="BORDER-RIGHT: #FFE000 2px dashed; BORDER-TOP: #FFE000 2px dashed; Z-INDEX: 3; VISIBILITY: visible; BORDER-LEFT: #FFE000 2px dashed; WIDTH: 90px; BORDER-BOTTOM: #FFE000 2px dashed; HEIGHT: 110px"><img onmouseup="dragstop()" onmousedown="dragstart('imDrag')" id="spacer" height="110"
							src="images/transparent.gif" width="90" border="0" name="spacer"> </div>
            </div>
            <div id="imResize" style="Z-INDEX: 4; LEFT: 97px; POSITION: absolute; TOP: 203px"><a onmouseup="resizestop()" onmousedown="resizestart('imGrid')" href="javascript:;"><img src="images/resizer.gif" border="0"></a> </div>
            <div id="imDiv" style="Z-INDEX: 1; LEFT: 5px; VISIBILITY: visible; WIDTH: 400px; POSITION: absolute; TOP: 91px; HEIGHT: 1px"> <img id="daimage" src="/status/photo/no/<%=filename%>" border="0" /></div>
            <input type="submit" name="SaveButton" value="Spara bilden" id="SaveButton" class="button" />
            <input name="UserImageX" id="UserImageX" type="hidden" value="0" />
            <input name="UserImageY" id="UserImageY" type="hidden" value="0" />
            <input name="UserImagex2" id="UserImagex2" type="hidden" value="90" />
            <input name="UserImagey2" id="UserImagey2" type="hidden" value="110" />
            <script language="javascript">
					init();
				</script>
          </div>
          <div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>

En liten parantes. Efter sista </DIV> -taggen saknas det en </FORM> -tagg.

http://php.amnuts.com/demos/crop-canvas/interactive.php

Här är ett alternativ som i alla fall jag tyckte var lite enklare att få att fungera.

På sajten finns beskrivning, kod att ladda ner samt ett aktivt forum att tillgå om man behöver fråga om något.