Ok, so maybe my subject line has the answer (layers) but I'm not wanting to get heavy into DHTML and/or layers. It's only a whole area of HTML that I don't know enough about (kinda like what I'm posting about).
I have a web application that when you log in, you can perform more or less functions. And the functions are grouped under 'tabs'.
So right now, the images are all sized absolutely, sliced up and are stuck in a table row. The images have a width and height. Also, the tiny little piece of the background image (viewable between the two curves at the top of the tabs) is included with the tab images (ie: the tab is not a transparent gif that lets us "see through" to the background gradient).
My first question then, is it even possible to do this? Have one image sit on top of another? Almost like if the tr tag had a background image (the gradient) and each td cell contained a square image of a tab, with the curvy piece at the top being transparent. But of course, there's not tr image background attribute. So how to do it? Am I stuck with layers? will it even work with layers?
Second, because there are a variable amount of tabs, can the last piece at the right (the gradient that isn't covered by a tab) be made to 'stretch' to fit the remaining space? The background, which thankfully is not a gradient anymore, with the minimum amount of tabs (as shown in the screenshot) does not have any vertical patterns. So a 2pxl by 36 high pxl image of this background ought to be able to stretch and fill the last td tag. But can we do this in HTML? I'm thinking like how you can specify the body tag's background image be a very simple pattern and then have it 'fill'.
Thanks for any help. [ July 25, 2003: Message edited by: Mike Curwen ]
okay now this is not that bad of a problem, I am rather busy right now, but I can give a quick response. Now lets look at the background first. You want to look into CSS for this You can set each td to a class and have the bg set to a specific location and repeat it in any direction. If I was at home, I could post the code. Now for the images, there are 2 routes you can go. First is DHTML/CSS Based You change the z-index of the images which can be done rather easy. Set the ones in the back to 0 and he front to 1 and you got overlap Second way is just multiple images with image swaps. Build a bunch of images in the up position and down position. When you click it, you just change the image to the right one. If you want more details on something, just ask. Eric
So maybe what i want is a tr that is as tall as the tabs, and as wide as the background. And I'd place a single image as the bg using the style sheet. That single image is a horizontal slice of my gradient. Then I can just add as many tab images as I want "on top" of this bg image. And the transparent corners will allow my gradient to show through.
Does that sound right?
Joined: Nov 08, 2001
Hey, I did not forget about you, I just do not have an internet connection at my new apartment yet. So you just want to dynamically position the bg of the table cells/row?