This page is a demonstration page showing the difference between the dropdown and accordion menus. It was used to develop my Portfolio Template. The code from the W3C website was adapted to implement the menu system as seen on pages other than this one. I partially modified this page so that the original W3C Try it example was clearly shown. I have modified the menu on the left considerably and I only use the W3C.css accordian button.
The W3C website explains:
Below is the code that controls the accordian as implemeted by W3C.css.
The function myAccFunc() - as used on this page and in the W3C.css example:
function myAccFunc() {
var x = document.getElementById("demoAcc");
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
x.previousElementSibling.className += " w3-green";
} else {
x.className = x.className.replace(" w3-show", "");
x.previousElementSibling.className =
x..className.replace(" w3-green", "");
}
}
The code in portfolio.js, the "control" file for my portfolio template, has the colours modified and the colours of the menu items are also changed on the template. For example,
Background to this page
This page was accessed at the same time as the Friends template. The Friends Template is also an earlier version of what I now use.
Since creating the Friends Template I have Integrated the W3.css Dropdown into the main template used for this site.
Links
External Sources