Dynamic page content based on which tab is selected
Suppose you have a row of tabs on your page (or a column, whichever)... and you want to update what displays on your page when a user clicks a tab - but you do not want to change the URL - how do you do this?
Perhaps you want the tabs to change an image or load a video onto your page? The example below simply shows some text appearing onto the page, but what you choose to load is up to you.
Click a tab above!
To achieve this effect, here is the CSS for the horizontal tabs:
Here is the HTML for the tabs and the container for the content:
Here is the "tabClick" javascript function: