Netscapte & Javascript

[nguye103]

Hello,

I have this javascript that let's the user see the latitude and longitude when they move the mouse over an image. The problem is that this only works in explorer and not netscape or mozilla. I was wondering if anyone could give me any help on getting this to work on netscape and or firefox too. You can see it in action here:

http://bsrsi.msu.edu/cgi-bin/gz/e0010541219002

And this is the javascript:

function SubmitForm() {
document.forms[1].elements["imagex"].value = nowX;
	document.forms[1].elements["imagey"].value = nowY;
document.forms[1].submit();
}
function DoHocusPocus() {
	deltaXgeo = Math.abs(lowerRightXgeo - upperLeftXgeo);
	deltaYgeo = Math.abs(lowerRightYgeo - upperLeftYgeo);
	pctX = nowX / ImgX;
	pctY = nowY / ImgY;
	offsetXgeo = deltaXgeo * pctX;
	offsetYgeo = deltaYgeo * pctY;
	NewXgeo = upperLeftXgeo + offsetXgeo;
	NewYgeo = upperLeftYgeo - offsetYgeo;
	NewXshortgeo = ( Math.round( NewXgeo * 1000000)) / 1000000;
	NewYshortgeo = ( Math.round( NewYgeo * 1000000)) / 1000000;
	document.forms[0].elements[1].value = NewXshortgeo;
	document.forms[0].elements[0].value = NewYshortgeo;

	deltaXutm = Math.abs(lowerRightXutm - upperLeftXutm);
	deltaYutm = Math.abs(lowerRightYutm - upperLeftYutm);
	offsetXutm = deltaXutm * pctX;
	offsetYutm = deltaYutm * pctY;
	NewXutm = upperLeftXutm + offsetXutm;
	NewYutm = upperLeftYutm - offsetYutm;
	NewXshortutm = Math.round( NewXutm );
	NewYshortutm = Math.round( NewYutm );
	document.forms[0].elements[3].value = NewXshortutm;
	document.forms[0].elements[2].value = NewYshortutm;
}

function DispCoords(eventType) {
xVal = parseInt(window.event.x);
		yVal = parseInt(window.event.y);
		layerArray = document.all.item("ImgLayer");
		imgLayer = document.all.item("ImgLayer").style;
		ImgX = document.images[0].width;
		ImgY = document.images[0].height;
with (document.forms[0]) {
if ( xVal > parseInt(imgLayer.left) && yVal > parseInt(imgLayer.top) ) {
				if ( xVal <= (parseInt(imgLayer.left) + ImgX) && yVal <= (parseInt(imgLayer.top) + ImgY)) {
					nowX = xVal - parseInt(imgLayer.left);
					nowY = yVal - parseInt(imgLayer.top);
					DoHocusPocus();
				}
			}
}
}

function DoIt() {
	upperLeftXgeo  = arguments[0];
	upperLeftYgeo  = arguments[1];
	lowerRightXgeo = arguments[2];
	lowerRightYgeo = arguments[3];
	upperLeftXutm  = arguments[4];
	upperLeftYutm  = arguments[5];
	lowerRightXutm = arguments[6];
	lowerRightYutm = arguments[7];
document.onmousemove = DispCoords;
}

And here is where the html calls upon the javascript:

if($got_coords) {
		if ($width < 300) { $layerorigin = 200; }
		elsif ($width < 550) { $layerorigin = 100; }
		else { $layerorigin = 10; }
		if($clientware =~ m/msie/) { $layerorigin -= 15; }
		$coo_string = "${ULX2_geo},${ULY2_geo},${LRX2_geo},${LRY2_geo},${ULX2_utm},${ULY2_utm},${LRX2_utm},${LRY2_utm}";
		print <<"__INSERTIMAGE__";
		<DIV ID="ImgLayer" STYLE="left:${layerorigin}; top:${imagetop};">
		<A HREF="javascript:SubmitForm();" onMouseOver="DoIt(${coo_string});">
		<IMG ALT="" WIDTH=$width HEIGHT=$height src="/tmssb/${imgnum}.jpg" BORDER=0></A>
		</DIV>
		
__INSERTIMAGE__
	}
	else {
	print "<P><input WIDTH=$width HEIGHT=$height type=image name=image src=\"/tmssb/${imgnum}.jpg\" BORDER=0><BR>\n";
}
}

ANY help would be appreciated! Also any websites that you can point me to that can help me would be great. I tried looking this up...but I don't have much experience with java, so I am clueless as to where to start. THANK YOU.

 

[kaht]

One thing I can see right off the bat is that the DispCoords function is using the document.all collection. This is IE only, replace it with cross-browser friendly getElementById("idname") or document.frames["framename"].elements["objname"] for starters.

And one more thing:

but I don't have much experience with java

Java and javascript are 2 VERY different things. Be careful not to get them confused.

-kaht

...looks like you don't have a job, so why don't you get out there and feed Tina.