Home
1
Showing Categories as Tabs Fri Mar 23, 2012 2:30 am
Unknown Data
Registered Member
Posts : 833
Points : 254
Age : 28
Location : Denmark
Browser :
First topic message reminder :
| Showing Categories as Tabs Display the categories as clickable tabs on Forumotion |
To display the forums, can be done i many different ways. Here will the categories be displayed as tabs, and when someone clicks a tab, will the categories forums be displayed, while the other categories (+forums) is hidden. The function itself is very simple, because we just a moving around existing elements and creating a couple of new ones. The function will add a number of tabs on the top, according to the number of categories you got. A little box under those tabs will also be visible, with the content of the clicked tabs forums. And that's actually just about it. To give a short description of what the Javascript does, then read the following points: - We start out with creating the function ttf, which will display the clicked categories forums and hide the others. This is done by finding the forums which comes with the category, and set a created elements content, equal to those forums. We can find the categories forums, by looping through all the categories and give them all a number, an get them by using that number. - The next part of code will activate, when the whole page is loaded. After that are we checking if this is the index front page, and if that is true, will we create all our elements (tabs and the content below the tabs) and give them an ID, so we are able to change thier content and style. As mentioned before, are we creating a loop, to make the number of tabs exact to the number of categories. When this is done are we moving the elements around, and then will the function be able to run. Here you have the Javascript for the 4 different versions of forumotion boards: Invision:
CSS isn't necessary, because we're moving existing elements around, and creating elements that have a fine default style. But! I've anyway writtin a little CSS, which will frame the tabs and the selected categories.
*If you are using PHPBB2 or PUNBB and have edited the templates for categories, will the function properly not work. |
| Notice : These tutorials are copyrighted by WebArtz Forum. You may not publish it on anywhere without written permission from the administrators. |
