WEB STANDARDS CREATIVITY

{
modules1Modules[modules1Modules.length] = divs[i].getAttribute("id");
}
}
document.cookie = "modules1=" + modules1Modules.join(",");
var modules2 = document.getElementById("modules2");
var modules2Modules = [];
var divs = modules2.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++)
{
if (hasClass(divs[i], "module"))
{
modules2Modules[modules2Modules.length] = divs[i].getAttribute("id");
}
}
document.cookie = "modules2=" + modules2Modules.join(",");
}
return true;
};
Now when a module is repositioned, two cookies are written. For each module area, the divs with a class of module are
found and their IDs added to an array. The array will reflect the order of the modules, as getElementsByTagName() returns
elements in source order. Once the array has been completed, it is written into a cookie—either modules1 or modules2,
depending on the circumstances, with each of the IDs separated by a comma.
When these cookies are passed to the server, you should be able to use them to check the order of the modules and write
them into the web page in the appropriate order.
Conclusion
The diversity of user needs—whether technological or task-based—is challenging the traditionally static form of the Web.
Creating dynamic interfaces is one of the ways that you can help to meet those needs. The two techniques I’ve described
here demonstrate how the flexibility of standards-based web pages can change the way in which we design for the Web.
chapter 9 Creating Dynamic Interfaces Using JavaScript
241