Topic awaiting preservation: CSS is screwing with my JS again :(

Grrrr! I just can't figure out why the hell this is happening!

This page works fine in NN4 but not in IE5 and Mozilla. It did work in IE5 and Mozilla untill I tried yet again to put all the styles inside the <style></style> tags. It's not that the styles themselves are not being defined cause they are. But I can no longer access any of my layers(Div's) properties. They all return blank or undfeined. However, document.getElementById("homeDiv") will still return [object] but document.getElementById("homeDiv").style.top (or.left or .visibility etc etc..) will return nothing!!!

On that particular page I've used Class="xxxxxx" but the same thing happend when I just use id="xxxxx" and reference the styles as #xxxxx {xxxxx:xxxx;}.

I'm certain I've gotten everything right so this should be working. Hell, I even went out and brought a CSS and DHTML book and I still can't figure it out!

Sure, I could just use style="xxxxxxx" for each element and it'd all work again but that kinda defeats the pourpose of CSS now doesn't it.

Any help whatsoever would be extreamly appreciated. I don't have much hair left!

Drac.

Its solidly broken in IE5/WinNT line 30, char 43, invalid arguement. The answer to your question must be obvious but I can't spot it.

Emps

Couple of things.

One you are using classes for each of these. you should be defining the individual divs using ID's (#homediv not .homediv)

You do not want to define elements (IDs) using the same name as your classes the browser is going to get confused.



:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

quote:

---

function mathPN(n) { return eval((n-n)-n) }

---

why are using using (n-n)-n instead of -n+0 ?



[This message has been edited by lallous (edited 09-19-2001).]

or of course (-n)



:[ Computers let you make more mistakes faster than any other invention in human history, with the possible exceptions of handguns and tequila. ]:

Emperor: There are nooooo JS errors when I set all of the styles using style="xxxx" for each element. I've tyed switching back and fourth several times, still no go when using #xxxxxx or .xxxxx in the style tags. And, that is actualy line 30 of the objects.js file which it also a line of code that Netscape uses. Here's a slightly eariler version of the site. I havent changed any of the actualy JS code since what's there now...

Bitdamaged: I've tried using #hoveDiv ect without using the Class="homeDiv" but the exact same thing happens. see, all bad.


lallous: Eh? oops... my bad. I think I was so extreamly tired when I wrote those. Heh, It made sence to me at the time...
This look better:

// Percentage p of Number n
function mathPer(n,p) {return (n/100)*p}
// n to Posotive
function mathPos(n) {(n<0)? return 0-n:n}
// n to Negative
function mathNeg(n) {(n>0)? return 0-n:n}
// Switch n Positve/Netagive
function mathPN(n) {return 0-n}


Thanks for all your help and comments guys but I still can't seem to figure it out. Edit:

Edit: -n? or (-n)? does that really work? heh, cool

Edit: tyop

[This message has been edited by Dracusis (edited 09-19-2001).]

I'm stumped. I'm not sure if it matters but your older version using style="" has this code:

style="

      position:absolute;

      z-index:1;

      left:2500;

      top:2500;

      width:300;

      height:300;

      color:#502800;

      padding:0px;

      margin:0;

      border-width:2px;

      border-color:#502800;

      border-style:solid;

      font-family:Arial;"

while your style sheets on the page look like:

#homeDiv {

	position:absolute;

	left:2500px;

	top:2500px;

	width:300px;

	height:300px;

	z-index:10;

	color:#502800;

	padding:0;

	margin:0;

	border-width:2px;

	border-color:#502800;

	border-style:solid;

	font-family:Arial,Helvetica,sans-serif;

}

So the styles aren't quite done in the same way (some 'px' is added some are taken away). I can't think why that would be a problem but trying getting the styles in the version that isn't working to be indentical to those that are (i.e. remove the pixel part from the top, left, etc. styles). IE5 can be a bit funny although in other regards it can be pretty lax. Give it a go anyway see if it helps.

Emps

I tried it but still no go

Arr well. I give up. I'll just use style="xxxxxx". It's a tad annoying but at least it works.

Thanks heaps for ally your help though. I really appreciate it.

just a question,

what is the difference between naming the style elemet like: #style {attr:value} and .style {attr:value}

(the '.' and the '#')

You name the style with a '.' when you want to assign them as a class, .style{att:value;} then use class="style" to apply that style to the element.

Or you can use the '#' to assign a style to a named element, #styleId{att:value;} will be applied to the element with id="styleId", you don't need to specify class="styleId".

The id method '#' is mostly used for setting layer styles as you can't have two id's named the same in the one document.

Heh, look, this book I just brought actualy did teach me something. Well I'll be dammed!



Edit: Bold Italics kick booty!

[This message has been edited by Dracusis (edited 09-20-2001).]