not sure how to describe this ...

[amory]

I'm not quite sure how to describe what I'm trying to do, so I'm going to give an example. On the google.com page, there are five tabs at the top: Web, Images, Groups, Directory, and News. When you click one of those tabs, you go to the corresponding page, and the corresponding tab is no longer selectable.

My question is, how do I do that?

Actually, let me clarify one thing. My assumption is that they are using frames, which is what I'm using. I have tabs (or buttons) that change the content in the middle frame, but the frame that contains the buttons never changes. My goal is to make the button corresponding to the current page not selectable. I hope that makes sense. (I also made the assumption that this is a javascript question and not an HTML question. If I'm in the wrong forum, please let me know.)

[Phil Karras]

Can be done with two frames, one holds the tab-menu other holds the page.

When you click on a tab it does two things,
1. brings up a new tab menu with present tab no longer active, can be a different color, whatever.

2. brings up the page wanted in the second frame.

Michael Moncur on his http://www.jsworkshop.com/ site has an example of just this type of thing.

[amory]

Thanks Phil for your reply. It sounds like what you're saying is that rather than have just one html file that occupies frame one, I need an html file for each button where the button corresponding to the information in frame 2 is not selectable. So in my case where I have five buttons, I'd need six html files to potentially occupy frame one. This to me seems like it beats the purpose of having frames. The thing that I liked about having frames is that I only needed to create and display those buttons once. But if I'm creating an html file for each time a button is not selectable, I might as well ditch the frames and just place the buttons on each page.

I guess what I was hoping for was something along the lines that when you click a button, it remains in it's over state and is not selectable until you click another button.

Also, I tried looking for the example you referred to on the link you sent, but I couldn't find it. Is it one of the examples contained in one of the books? Do you know which book version it is in?

[nkaisare]

You dont need frames for it.

<a href="tab1.html">Tab 1</a> |
<span style="font-weight: bold">Tab 2</span> |
<a href="tab3.html">Tab 3</a> |
<a href="tab4.html">Tab 4</a> |
<a href="tab5.html">Tab 5</a>

In other words, for tabn.html, just remove the nth link.

[pyro]

Originally posted by nkaisare
In other words, for tabn.html, just remove the nth link. Which you could do dynamically, with either PHP (or other server-side languages) or JavaScript, if you want...

[Phil Karras]

Right, the example Michael had was in one of his books and yes he also had a bunch of files for the menu.

As to not needing a bunch of files pyro said it. Now, I wouldn't bother with PHP if it can be done in JS just because I'm a believer in using the clients machine as much as possible. If we all did that we clog the internet less. (IMHO)

As for doing it that way, The first thing I'd try is simply holding a value in a var indicating which was the last button clicked, and if that one is clicked again it get ignored.

Also, perhaps Pyro knows how to keep a color indication it's been clicked, presently "active", I can do some of this using CSS but not if it's a graphic.

If it is not a graphic use CSS, I think the trick will be trying to un-color a button once another is clicked? probably using JS would be best on that task. To color & un-color.

[pyro]

When I did it with JS, I was not using frames, so here's what I did:

I checked the pages location (window.location.href) and then did some parsing to get just the filename (minus the extention). Then, I gave each link an id that would be representative of the filename. I would then check if the filename == the id and if it did, I knew that that was the link to disable. It can be done with graphical or css (that is what I was using) menus.

As far as serverside vs. client side, it's not going to make a difference as far as bandwith goes. A serverside solution will be a bit harder on the server, and a clientside solution will be a bit harder on the clients machine, but neither way will really be enough to matter much. Also, the PHP version would work for everyone, including those with javascript disabled.

[Phil Karras]

Good point about JS being disabled, but since I deal with large server-side DBs & shopping carts I tend to do as much on the client side as I can. Just a differing point of view.

I will say that we've had no problems with people using the JS client-side shopping cart I designed. I guess all customers have JS enabled? Or the ones that don't, simply don't tell us about it.

[pyro]

I would highly recommend not doing things that way. I would only use JavaScript for non-essential elements on ones page.

[amory]

Thanks to all of you for your help. Pyro, I'm still pretty new javascript (though I know actionscript pretty well, so I think I can pick it up pretty quickly). Is there anywhere I can find a tutorial on how to do what you described?

[Phil Karras]

I haven't found any "good" tutorials on JavaScript, but I found a real good book:

Teach Yourself JavaScript in 24 Hours, by Michael Moncur - published by SAMS it's in its Third Edition.

Michael runs a web site to help beginners:
http://www.jsworkshop.com

[amory]

Thanks! I'll check it out.

[pyro]

I would very highly recommend "JavaScript, The Definitive Guide" by David Flanagan, if you are looking into getting a book.

[Phil Karras]

pyro,

Is that guide a good book for beginners or as a good reference?

The book I recommended was the one I used & I thought it was great, except that I used the 2nd edition.