Sun Dial Menu

Contextual Page Design

Depending on the content of a web page the header, footer and some links can be different. Pages that relate to website design, such as this one, will have headers and footers related to that fact. Pages where I am "railing on" can have pontification text and links.

Local pages have Belchamp Walter as a header.

The reason that pages didn't work on iPad was due to Javascript switch case logic

The switch/case structure is in script.js and seperate functions are triggered setting menu option and text.

The function setText()

// Set the text in the header and footer of each page Web Design
function setText() {
    document.getElementById("htext").innerHTML = "Tempusfugit Web Design";
    document.getElementById("ftext").innerHTML = "Experiments in web design";
// set the About Page link(s) - as there there could be more than 1
   document.getElementById("about_link1").innerHTML = "About Web Design on tempusfugit";
var a = document.getElementById("about_link1");
a.setAttribute("href", "about_web.html"); // I did this for the Home link on VH pages
var b = document.getElementById("site_map1");
b.setAttribute("href", "site_map.html"); //can have dedicated site maps for each page

The DOM code

The contextual nature of pages is determined using DOM Manipulation.

What needs to be changed on template

OnLoad needs to call SetContext(x) - where the argument x designates settings for web, local, drone, pont(ification) plus a default if not specified

Top Menu

Site design by Tempusfugit Web Design -