View Full Version : Javascript tabs?

10-31-2006, 10:40 PM
How can I place a tab control (no need for content sections) on a page that I can add/remove tabs to using only Javascript on the client?

11-01-2006, 04:47 PM
I'm not 100% sure what you're actually asking for here. Do you want a tabbed menu?

also - how do you want to add/remove these tabs using javascript? You can use DOM to add/remove elements from a page if that's what you mean...

...post a little more info and we should be able to help :)

11-01-2006, 05:51 PM
I was thinking of having javascript functions to add or remove tabs from a navigation element that lays across the page horizontally.

The tab control would need left and right arrows to scroll along the tabs in case more tabs were added than would fit on the screen.

The tab control could look like the ones at http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/index.htm but it does not need a content section. I will use layers/divs for content.

The main thing is to have a navigation UI that emulates the look and feel of tabs because it is a UI element that many people are familiar with.

I may have to incorporate CSS to get the tab look and feel - but, I'm still looking.

There are plenty of very nice tab controls available for use on the server, but I want a tab control that can be used entirely on the client side. I want to be able to add/remove tabs using javascript without any return trips to the server.

The tabs should have events that fire for (at least) onclick and mouseover (the more events the better, of course).

And, cross-browser compatability is a MUST. Even if it means the tabs look kind of cheesy. Cheesy tabs beat no tabs every time.

Thanks for your help. I'll keep poking at it....

11-01-2006, 05:56 PM
ok thanks - it's much clearer now!

i assume that if you want to add/remove tabs, these should be stored in some database for future use?

What I tend to do with menu's (or in this case tabs) is to create a bullet list in html then use CSS to style each one in to a "tab".

In fact the example you gave does that.

All you'd do is probably use some Ajax to send a request to the server which would add a new tab or using the same method, remove one.

is that what you mean?

11-01-2006, 08:03 PM
That's exactly what I DON'T want to do. There is no database list for the tabs.

I don't want to have to use server side scripts to add or remove the tabs. If I haven't made it clear that I want to add/remove tabs using client side javascript, I seriously doubt I have made anything else about this navigation control clear either.

Well, I don't really know how to make it much clearer - so it looks like I'm on my own with this one.

Thanks anyway.....