The new forums will be named Coin Return (based on the most recent vote)! You can check on the status and timeline of the transition to the new forums here.
The Guiding Principles and New Rules document is now in effect.
Building a simple tabbed webpage
Centipeed
Registered User regular
Registered User regular
I'd like to make a simple tabbed webpage. Here's an example of what I need:
As you can see, it's not some huge undertaking. Right now I'm accomplishing that using HTML and CSS, but it's a bit of a round-about method, and there's still the screen flicker as it loads a new HTML page. As well as that, the HTML/CSS displays differently on different browsers, and I'd rather have a solution that's the same across the board.
I'd prefer to do it dynamically (Javascript?), so that all the content is loaded and clicking a tab actually loads the content inline instead making it look as if it does.
What is the best way to go about doing this? Keep in mind that I don't know Javascript.
As you can see, it's not some huge undertaking. Right now I'm accomplishing that using HTML and CSS, but it's a bit of a round-about method, and there's still the screen flicker as it loads a new HTML page. As well as that, the HTML/CSS displays differently on different browsers, and I'd rather have a solution that's the same across the board.
I'd prefer to do it dynamically (Javascript?), so that all the content is loaded and clicking a tab actually loads the content inline instead making it look as if it does.
What is the best way to go about doing this? Keep in mind that I don't know Javascript.
Centipeed on
0
Posts
This can be done with a wee combination of javascript and CSS. Basically you have all the content in the HTML document, one section after the other (this makes it more accessible and indexable), set the style of each box of text to display: hidden; (except for one) and then use some javascript to switch the display state to block for one section and hidden for all the others when you click on each link.
Alternatively, you could use a simple javascript gallery script to get a similar effect and customise it to display text content instead of pictures (or both if you want). Simple javascript galleries are basically just a series of links to images and an alt= description then when you click the link a javascript function is evoked that displays the picture in a location on the HTML page along with any alt text instead of loading the picture in a separate window.
http://www.barelyfitz.com/projects/tabber/