Changing CSS 'display' property of generated content
I am currently developing my new site and I would like the portfolio sections of the site to display my dynamically generated content one project at a time. The content is pulled from an XML file and is written into a dynamically generated set of div tags as so:
If you visit the site at http://www.peterseaman.co.uk/PORT_TEST/web.html,
var projects = xmlDoc.getElementsByTagName("project");
for (i = 0; i < projects.length; i++)
var div = document.createElement("div");
div.className = "work";
div.name = "work";
div.id = "project" + [i];
you can see that this works just fine and all the projects in the XML file are generated in the html.
What I would like to happen, is that the first project's containing div is given a display: block, and all other projects a display:none. The user can then click a next or previous button and the display property of the next or previous div is set to block, and all others to none - so showing just one project at a time.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Tags for this Thread