setting style in firefox??

[halfasleeps]

i have this code that sets the style left to X_pos and the style top to Y_pos both ie and firefox can see what X_pos is and what Y_pos is yet only ie sets the style to it firefox does not

//sets b.left to X_pos
b=(document.layers)?g:g.style;b.left=X_pos;f=false;
//sets b.top to Y_pos
b=(document.layers)?g:g.style;b.top=Y_pos;f=false;
//ie returns the same thing for X_pos as for left but firefox returns the correct number for X_pos but left returns as 0
alert('X_pos= '+X_pos+' left= '+b.left+' Y_pos= '+Y_pos+' top= '+b.top);

so i am assuming tha this is not the correct way to set it in forefox....can someone please tell me how?

[halfasleeps]

left and top corresponds to this, this is what im changing

<div id="diamonds" style="position:absolute; left:0px; top:0px; width:130px; height:255px; z-index:1; visibility: hidden;">

[codecrazy]

where is the rest of the code?

I am assuming that you are implementing an event handler. If that is the case then you should use clientX and clientY, they are supported in everything but NS 4.x, which doesn't really matter since its an archaic browser that no one should be using at this point anyway.

Another point is that to reference event properties in IE you will need to use window.event.clientX, for the rest I think you can just use event.clientX. I would use document.all in my if condition to check for IE and let the else condition evaluate to the action to take for all other browsers.

Below is a sample of code that I wrote for an alert Div that I created.

if(window.event){	// then browser is IE				
     alertDiv.style.top = window.event.clientY + 'px';   // IE Event Model has event as a global object not a parameter
     alertDiv.style.left = window.event.clientX + 'px';	// passed to the event handler.  Must reference with 'window.'
} else {
     alertDiv.style.top = event.clientY + 'px'; // Mozilla passes a new event object as a parameter to the event handler
     alertDiv.style.left = event.clientX + 'px'; // and does not reference the object as a child of the window object.						
}

[halfasleeps]

in IE it works perfectly how it is, i didnt show the rest of the code bc both IE and FF see what X_pos is, its just that IE sets the style.left to X_pos and FF does not ...heres the entire function

function P7_autoLayers() { 

 var g,b,k,f,args=P7_autoLayers.arguments;
 if(!document.p7setc) {p7c=new Array();document.p7setc=true;}
 for(k=0; k<p7c.length; k++) {
// w = MM_findObj(args[1]);
 //alert(p7c[k]+','+args[1]);
 //if(p7c[k] != args[1]){
 for(HH=0;HH<=8;HH++){
 if(p7c[k] == noHide[HH]){
 //alert(noHide[HH]);
 p7c[k] = 'bob';
 }}
  if((g=MM_findObj(p7c[k]))!=null) {
   //alert(p7c[k]);
   b=(document.layers)?g:g.style;b.visibility="hidden";}}
 for(k=0; k<args.length; k++) {
  if((g=MM_findObj(args[k])) != null) {
   b=(document.layers)?g:g.style;b.visibility="visible";f=false;
   //////////////////////////////////////////////
   //////////////////////////////////////////////
   /////////set position/////////////////////////
   
  // marginLeft = document.body.style.margin-left;
   //alert(marginLeft);
  //	docTop = document.body.style.marginTop = 12;
 	//docLeft = document.body.style.marginLeft = 12;
	
	if(parseInt(document.body.style.marginLeft)) {
		docLeft = parseInt(document.body.style.marginLeft);
	}else{
		docLeft = document.body.leftMargin;
	}
	if(parseInt(document.body.style.marginTop)) {
		docTop = parseInt(document.body.style.marginTop);
	}else{
		docTop = document.body.topMargin;
	}
	//docTop = document.body.topMargin;
 	
	//alert('top='+docTop+' '+'left='+docLeft);
	//alert(parseInt(document.body.style.marginLeft));
  	w = MM_findObj(args[1]);
    //alert(w);
    X_pos = findPosX(w);//+Number(docLeft);//+10;
	//alert(w.offsetHeight);
	Y_pos = findPosY(w)+Number(w.offsetHeight);//+Number(docTop);//+33;
	//Y_pos += 200;
	//X_pos = 400;
	drop_width = b.width;
	d_w = drop_width.split('p');
	drop_width = d_w[0];
	//alert(drop_width);
	right_side = Number(X_pos)+Number(drop_width);
	///////////get doc width and hieght////////////
	//opera Netscape 6 Netscape 4x Mozilla 
	if (window.innerWidth || window.innerHeight){ 
		docwidth = window.innerWidth; 
		docheight = window.innerHeight; 
	} 
	//IE Mozilla 
	if (document.body.clientWidth || document.body.clientHeight){ 
		docwidth = document.body.clientWidth; 
		docheight = document.body.clientHeight; 
	} 
	//alert(docwidth);
	//////////////////////////////////////////////
	if(right_side>docwidth){
		over = Number(drop_width) - Number(w.offsetWidth);
		X_pos -= over;
	}
	// SET THE STYLES
	//b=(document.layers)?g:g.style;b.left=X_pos;f=false;
	//b=(document.layers)?g:g.style;b.top=Y_pos;f=false;
	b.left=X_pos;
	b.top=Y_pos;
	//alert(b);
	//alert('X_pos= '+X_pos+' left= '+b.left+' Y_pos= '+Y_pos+' top= '+b.top);
	/*
    b=(document.layers)?g:g.style;b.left=470;f=false;
	b=(document.layers)?g:g.style;b.top=470;f=false;
	*/
	///////////////////////////////////////////
	///////////////////////////////////////////
	///////////////////////////////////////////
   for(j=0;j<p7c.length;j++) {
    if(args[k]==p7c[j]) {f=true;}}
  if(!f) {p7c[p7c.length++]=args[k];}}}
}

[Pepejeria]

function P7_autoLayers() { 

 var g,b,k,f,args=P7_autoLayers.arguments;
 if(!document.p7setc) {p7c=new Array();document.p7setc=true;}
 for(k=0; k<p7c.length; k++) {
// w = MM_findObj(args[1]);
 //alert(p7c[k]+','+args[1]);
 //if(p7c[k] != args[1]){
 for(HH=0;HH<=8;HH++){
 if(p7c[k] == noHide[HH]){
 //alert(noHide[HH]);
 p7c[k] = 'bob';
 }}
  if((g=MM_findObj(p7c[k]))!=null) {
   //alert(p7c[k]);
   b=(document.layers)?g:g.style;b.visibility="hidden";}}
 for(k=0; k<args.length; k++) {
  if((g=MM_findObj(args[k])) != null) {
   b=(document.layers)?g:g.style;b.visibility="visible";f=false;
   //////////////////////////////////////////////
   //////////////////////////////////////////////
   /////////set position/////////////////////////
   
  // marginLeft = document.body.style.margin-left;
   //alert(marginLeft);
  //	docTop = document.body.style.marginTop = 12;
 	//docLeft = document.body.style.marginLeft = 12;
	
	if(parseInt(document.body.style.marginLeft)) {
		docLeft = parseInt(document.body.style.marginLeft);
	}else{
		docLeft = document.body.leftMargin;
	}
	if(parseInt(document.body.style.marginTop)) {
		docTop = parseInt(document.body.style.marginTop);
	}else{
		docTop = document.body.topMargin;
	}
	//docTop = document.body.topMargin;
 	
	//alert('top='+docTop+' '+'left='+docLeft);
	//alert(parseInt(document.body.style.marginLeft));
  	w = MM_findObj(args[1]);
    //alert(w);
    X_pos = findPosX(w);//+Number(docLeft);//+10;
	//alert(w.offsetHeight);
	Y_pos = findPosY(w)+Number(w.offsetHeight);//+Number(docTop);//+33;
	//Y_pos += 200;
	//X_pos = 400;
	drop_width = b.width;
	d_w = drop_width.split('p');
	drop_width = d_w[0];
	//alert(drop_width);
	right_side = Number(X_pos)+Number(drop_width);
	///////////get doc width and hieght////////////
	//opera Netscape 6 Netscape 4x Mozilla 
	if (window.innerWidth || window.innerHeight){ 
		docwidth = window.innerWidth; 
		docheight = window.innerHeight; 
	} 
	//IE Mozilla 
	if (document.body.clientWidth || document.body.clientHeight){ 
		docwidth = document.body.clientWidth; 
		docheight = document.body.clientHeight; 
	} 
	//alert(docwidth);
	//////////////////////////////////////////////
	if(right_side>docwidth){
		over = Number(drop_width) - Number(w.offsetWidth);
		X_pos -= over;
	}
	// SET THE STYLES
	//b=(document.layers)?g:g.style;b.left=X_pos;f=false;
	//b=(document.layers)?g:g.style;b.top=Y_pos;f=false;
	b.left=X_pos;
	b.top=Y_pos;
	//alert(b);
	//alert('X_pos= '+X_pos+' left= '+b.left+' Y_pos= '+Y_pos+' top= '+b.top);
	/*
    b=(document.layers)?g:g.style;b.left=470;f=false;
	b=(document.layers)?g:g.style;b.top=470;f=false;
	*/
	///////////////////////////////////////////
	///////////////////////////////////////////
	///////////////////////////////////////////
   for(j=0;j<p7c.length;j++) {
    if(args[k]==p7c[j]) {f=true;}}
  if(!f) {p7c[p7c.length++]=args[k];}}}
}

Is that code also supposed to be readable by humans?

if(window.event){	// then browser is IE				
     alertDiv.style.top = window.event.clientY + 'px';   // IE Event Model has event as a global object not a parameter
     alertDiv.style.left = window.event.clientX + 'px';	// passed to the event handler.  Must reference with 'window.'
} else {
     alertDiv.style.top = event.clientY + 'px'; // Mozilla passes a new event object as a parameter to the event handler
     alertDiv.style.left = event.clientX + 'px'; // and does not reference the object as a child of the window object.						
}

No need to repeat code:

if(!oEvent) var oEvent = window.event;
alertDiv.style.top = oEvent.clientY + "px";
alertDiv.style.left = oEvent.clientX + "px";

[halfasleeps]

Is that code also supposed to be readable by humans?

thats why i didnt show it in my first post


i tried this:

clientY = Y_pos; //set clientX and clientY to
clientX = X_pos; //X_pos and Y_pos 
if(!oEvent) var oEvent = window.event;
QQ = MM_findObj(args[0]); //the first argument is the div tag with the styles
QQ.style.top = oEvent.clientY;
QQ.style.left = oEvent.clientX;

with that IE stull kinda works but its not as accurate as it was before and FF still doesnt do anything

[Pepejeria]

I dont know really what you wanna do, or what args[0] is.

You could always check whats wrong with your code using the JavaScript console in Firefox. It will tell you exactly where the error is, and it will even highlight the line where it wrent wrong. Tada!

[halfasleeps]

to put this in way more simpler terms b is the actual css style declaration object

if i do this
b.left=255;
b.top=255;
alert(b.top);

IE says : 255px
FF says : 0px

theres no error tho either way.

[halfasleeps]

solved!!!

b.left = 255 + "px";
b.top = 255 + "px";

works in both IE and FF thanks guys!!!