One Last question - possible to relatively position with DOM?

Ok, one last weird question for THIS forum (I promise!!!) : Is there a way to control relative positioning of a table using the same format of DOM scripting like in my previous post? :

document.getElementsByTagName('table').item(#)... ? ? ?

Again, possibly using DOM syntax with "ByTagName" and an item# like above but, most importantly (this is a requirement-->), NOT dependent on the table tag having an ID nor NAME? For instance, if a table needs to be shifted up 10px from its current position? Can this be done?

:confused:

Try something like:


var tableObjects = document.getElementsByTagName('table');
var tableLen = tableObjects.length;

for(i=0;i<tableLen;i++){
tableObjects[i].setAttribute("style","position:relative");
tableObjects[i].style.top = "-10px";
}

Hey brothercake,

How would this be done for just one table repositioning? Let's see... I'll give it a shot though I know it will be probably wrong:

document.getElementsByTagName('table').item(5).setAttribute("style","position:relative")
document.getElementsByTagName('table').item(5).style.top = "-10px"

Wrong, right?!! So what's the correct way? Syntax is so confusing when it comes to DOM. Can you tell me of a good source (online, book, or otherwise) for DOM & CSS scripting?




:rolleyes:

IE is stupid and doesn't let you setAttribute('style'), although it should. No problem in Gecko though.

Should be as easy as:

refToElement.setAttribute('style', 'position: relative; top: -10px;');

But instead in order to make it work in IE:

refToElement.style.position = 'relative';
refToElement.style.top = '-10px';

Originally posted by tired&amp;lonely
Syntax is so confusing when it comes to DOM. Can you tell me of a good source (online, book, or otherwise) for DOM & CSS scripting?

What about W3C' site (http://www.w3.org/)?

Originally posted by jkd
IE is stupid and doesn't let you setAttribute('style'), although it should.

Yeah it should :(

So the whole thing would be

refToElement.setAttribute('style');
refToElement.style.position = 'relative';
refToElement.style.top = '-10px';


Is that right?

Originally posted by Bosko
What about W3C' site (http://www.w3.org/)? A newbie (or not-so-newbie) using the W3C website as a reference is roughly equivalent to a 2nd grader trying to read the King James Bible. The information is there, but without knowing what you are reading or having a fundamental understanding, It's difficult to extract any meaning.

SO, I suggest that you check out the MSDN and Gecko links in my signature. While some people don't like MSDN as a DOM reference, I like it because[list=1] It's the easiest to use
Has more/better examples than the Gecko DOM reference
Always indicates when a property/method/whatever is IE only, so you can steer away from those.
[/list=1]

I don't see whats so hard about it,you don't have to be a genius to understand it.Besides it covers all the DOM methods,which I can't say about the MS or Gecko reference.
I do agree that the Gecko DOM reference is a bit easier,because it also provides some example code.

Uhh, what's so hard about it? I'll tell you.

Pretend you are a newbie with just a loose understanding of what the DOM is, and have just begun to understand the relationships between methods, events, and objects. Now, let's say you visit the W3 site looking for some DOM reference material, so naturally you click the DOM link to the left. WHOA...a page with not so aesthetically formatted text with a sea of links. Where do you go? What do you click on? Maybe only after reading EVERY word on the page do you realize that the link you need is labeled 'DOM Technical Reports' under the 'Public Release of Specifications' heading and is over halfway down the page. THEN what? How do you choose next? DOM 1 Level 1? DOM 1 Level 1 2nd ed.? DOM 2 Core? Sure, this is an easy choice for me or you to make, but not nearly to the majority of people that visit this board.

Go to the Gecko or MSDN reference, and you're smack dab in the middle of DOM goodness. After all, we want what these browsers are acutally using, and not just what the W3C recommends, right?

... I learned all of my DOM knowledge from the W3C pages. I also learned all I know about SVG and MathML from them. I attribute most of my XML knowledge though to XML in a Nutshell by O'Reilly publishing.

Beetle is right. I had a hard time deciphering that W3C site, and I'm if anything the epitome of a novice. Also, I can't even get the darn W3C site to load right now (whats up with that?!). But I guess what I'm really looking for is not just a reference lising all the nuts&bolts of DOM, but also (and maybe more imprtantly) a good guide for learning and understanding DOM written without too much jargon... ya know, a DOM for Dummies sort of thing. :rolleyes: Does something such as this exist online?


Ok, I'm gonna break my promise I made at the top of this post, since I'm having problems loading that wonderful W3C site right now...

but if I have a <table name="thisone"> on a webpage, how can I find the DOM item number -- .item(#) -- for that table based on its name="thisone"?

:confused:

Found another good site...

http://www.xs4all.nl/~ppk/js/

Why do you need the table's item# if you already have it's name?

Useful resource and overview:
http://www.zvon.org/xxl/DOM1reference/Output/index.html

... though I learned the DOM from what a drunken cat scratched into the wooden door of the wine cellar in a full moon night ;) :D. In other words: Full ACK to what beetle wrote.

I know it's a weird question (but then, if it wasn't, it wouldn't be a tired&lonely question, would it?!!).... but the reason I need to determine a table's item# (even if I have its name) is because it will be used as an offset value to determine where other tables are located relative to that item# so that I can control their attributes using DOM.

{It's kinda hard for me to explain, but to give you some background on my problem: At load time the top and bottom of my webpage will be appended with code not generated by me but by outside sources. So, if I know the item# of my uppermost table (that is, within MY code generated portion) after the webpage is put together, then I can change the attributes of the tables that were appended above, by using the item# as an offset. Likewise, the same should be true for the bottom of the webpage. Anyway, I hope that's how that works.}

So now (with that crazily explained), how can I get a table's item# position within my webpage given that I know its name (or ID, for that matter)?

You'll have to iterate the collection to find it.

Assume your table has an id of "myTable":

var table = document.getElementById('myTable');
var tables = document.getElementsByTagName('table');
for (var offset = 0; offset < tables.length; offset++) {
if (tables.item(i) == table) break;
}


Now the variable offset refers to the offset of the specified table from within the document-level collection of tables.

Hello, jkd. I tried using your code (with modifications, of course), and it works beautifully!!! THANKS!!! But let's see if I got it all straight, syntax-wise for cross-browser support. Here's a snippet of what I have:


<script language="JavaScript">
var myTable = document.getElementById('titleblock');
var tables = document.getElementsByTagName('table');
for (var offset = 0; offset < tables.length; offset++) {
if (tables.item(offset) == myTable) break; }
var contractTable = offset - 2;
var descriptionTable = offset - 1;
document.getElementsByTagName('table').item(contractTable).border = "4"
document.getElementsByTagName('table').item(contractTable).style.backgroundColor = "#000000"
document.getElementsByTagName('table').item(contractTable).borderColorLight="#BBBBBB"
document.getElementsByTagName('table').item(contractTable).borderColorDark="#888888"
document.getElementsByTagName('table').item(contractTable).style.borderWidth='0px 4px 4px 4px'
document.getElementsByTagName('table').item(contractTable).style.position = 'relative'
document.getElementsByTagName('table').item(contractTable).style.top = '-24px'
document.getElementsByTagName('table').item(descriptionTable).style.visibility = "hidden"

AND SO ON AND SO FORTH TILL YOU HIT "MY" CODE...

<TABLE ID="titleblock">...



To everyone on this forum who's help me so far: THANK YOU SO MUCH!!! I know I'm a slow learner (and forum pest) and all, but I think I'm finally getting a handle on all this.

:thumbsup:

Originally posted by tired&amp;lonely
THANKS!!! But let's see if I got it all straight, syntax-wise for cross-browser support.

Looks fine. :)

Uh Oh!!! I shouldn't be too surprised this block of DOM doesn't work for Netscape 4. But can it be done? That is, is it possible to do these sorts of reformattings for pre-Netscape6 browsers, whereby I set up conditionals with separate Netscape DOM code? If so, where would be the best place online for a "newbie" to get Netscape DOM syntax help? Maybe right now after an all-nighter I'm too tired to find it and I'll find it later, but if any one wants to jump in on this, I would be tremendously appreciative!!!

:eek: yawn

Ok, if I bring up Netscape 4.x, maybe everyone's afraid to touch it. But let's try one simple question: Is it possible to reposition a table using Netcape 4.x DOM like I'm doing here with IE DOM???...

document.getElementsByTagName('table').item(contractTable).align = "center"

:confused:

No; not like that; not like anything like that.

It can be done in netscape 4 using a variety of proprietary hacks... but I would consider seriously whether it's worth it. I'll tell you how if you really want to know ...

Just a comment on the W3C specifications.

Those are written for software developers who are building browers or other web client applications, not for web developers who want to design web pages or write JavaScript.

It's kind of like buying a new stereo and trying to find out how to set the radio stations by looking at the wiring schematic. Well, maybe not that bad.

I have a list of good, web developer-friendly resources at http://www.brainjar.com/dhtml/resources.asp, but I also recommend looking at the W3C specs at some point. A little background can help you to understand how things work better.

Hello brothercake,

If it's not TOO much trouble for you... I'd really like to see a couple of those "proprietary hacks" for accomplishing this with Netscape 4.x. Perhaps I like a challenge, or perhaps I'm just overly curious, or perhaps I'm just really really foolish, but seeing something like that will give me something to play with (ya know, for my own pedagogic purposes) and might just lead me to a solution that works for my particular "quirky" application.

(By the way, does anyone know the latest percentage of worldwide internet users STILL using Netscape 4.x?)

Oh yeah, brainjar, I tried your link and it keeps coming up "page cannot be found".

:rolleyes:

according to www.thecounter.com last month NS4.x got 2%

Note: Some people don't like thecounter.com's stats, but I think ANY snapshot of the internet that is THAT big will be accurate within +/- 2%

Originally posted by tired&amp;lonely
Oh yeah, brainjar, I tried your link and it keeps coming up "page cannot be found".

:rolleyes:

The board included the trailing comma as part of the link, in case you didn't notice.

I edited the post to fix that in case someone else makes the same mistake without realizing it.

Well, if it's just 2%, then I guess it's virtually wasted effort to try to make javascripted/DOMed effects compatible with Netscape 4.x. Now, I just have to decide in what direction I should make things degrade gracefully.

(Thanks, jkd. I didn't even notice the trailing comma on the link, and the link works fine now. I've bookmarked it and I'm sure all of brainjar's expertise will be of much service to me as I move along the learning curve)

I stopped accomodating NS4.x 18 months ago....my clients never cared....

If it's not TOO much trouble for you... I'd really like to see a couple of those "proprietary hacks" for accomplishing this with Netscape 4.x. Perhaps I like a challenge, or perhaps I'm just overly curious, or perhaps I'm just really really foolish...Or, perhaps it's no problem letting others waste their time on such things...

http://www.codingforums.com/showthread.php?threadid=6858

Honestly, adios, I don't see what that other thread has anything to do with this one... FYI, adios, the coding ideas provided in that other series of posts were INDEED very very helpful for my application... and were NOT simply exercises in "letting others waste their time"!!! Perhaps, I made a mistake in not ending that particular thread with an explicit acknowledgement of my deep appreciation for all the help I got, or in posting a follow-up (per YOUR request) on the positioning considerations involved with NS4... but hey, how can I when I'm totally new at this (as I've repeatedly stated on every possible occassion)?!! In all seriousness, I only post those questions that I can not find answers to anywhere on the internet (or at least, in the form that I can understand)... and that serve a REAL purpose in the development of my application, or in the development of my knowledge on all things DOM/Javascript-related. That's what I understood was the purpose of this forum. But maybe I'm missing something. But then, maybe I don't catch your drift, adios... were you insulting me here, or what???!!! (I saw no smiley face)


(Is this maybe a time for a moderator to step in?)

tired&lonely, I think you hit the nail on the head when you pointed out that you failed to give even a simple thanks to the work done in the other thread.

On the other hand we help out because we like too. If our only reason to help is to receive recognition then perhaps we need to rethink our reasons. I can't count how many times I have given wonderful responses or code snippets to forum users only to have them slip off the bottom of the postings without a simple thanks or any comment at all.

Lets just keep our heads about us and remember our manners.

Thanks, John, for giving me some perspective on this. I do realize that the experts here are extremely generous with their time, efforts and expertise, and deserve all the thanks that can be given to them. That's why I usually try to including a "thank you" somewhere in my posts. In fact, in the thread that adios mentioned by link, I certainly did include a much-heart-felt "thanks" 5 posts down into it, even though I might have not ended it with a "thank you" again.... merely because I was kinda feeling that if I did so again I would be TOO effusive, ya know.

But really, I wonder if adios is being facetious now because I didn't end the other thread with a "thanks", or because he(she) deems my questions/problems as trivial or absurd. Hmmmm, I'm not too sure.

There is no guess work here. Just be polite. Adios obviously felt he wasted his time on that last snippet since you offered no thanks or comment.

Lets just get back to the matter at hand.

I myself only code for NS4 if the people with the checkbook demand it. It looks as if this thread has served its purpose so I am going to close it down.

tired&lonely, feel free to message me if you feel you need to discuss this further.