?
Solved

builduing a nav-tree for LOTS of html files

Posted on 2004-08-27
4
Medium Priority
?
188 Views
Last Modified: 2010-04-06
I am making a HTML based products catalog.
I have lots of products where each product is stored in its own HTML file (picture + info).
each file is named like this:    name_num.html
in one of the frames in the site I have three buttons: on to go to "home" on next and one prev.
I want to make the buttons work in such way: when I am on page : name_X.html and I click name_X+1.html and for back: name_X-1.html

I know I can make it manualy, like editing the link on each page but I have more then 300 file so....

Please tell me how can I make this work.
0
Comment
Question by:knfevg
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 25

Accepted Solution

by:
James Rodgers earned 500 total points
ID: 11915368
why not convert the entire catalogue to database driven, then you only need one page and you can generate teh links from the info in the database. the way you are sugghesting does not allow for easily adding more catalogue items and will be very hard to maintian and update if teh site look changes.
0
 
LVL 19

Assisted Solution

by:dakyd
dakyd earned 500 total points
ID: 11916281
Jester's right, the cleanest solution is probably to use a database.  If that's not to your liking or you can't use a database, an alternative suggestion would be to use javascript to automatically create the links for you.  You'd have to fill in the min and max values for the links, and you'd have to make sure that this script is included in every one of your pages (this is why Jester's solution is cleaner - you only need to change 1 page if you want to make a change, as opposed to changing all 300+).  It'll help if you save the script into a js file, then go through all your pages once to put in <script type="text/javascript" src="WHATEVER YOU NAME THE JS FILE"></script>.  After that, just edit the js file if you want to make changes.  Anyhow, hope that helps.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<script type="text/javascript">
var baseName = "test";
var min = 0;
var max = 300;

function init()
{
  var num = unescape(document.location.href).replace(/\D/g, "");
  num = parseInt(num);
  var theDiv = document.createElement("div");
  document.body.appendChild(theDiv);
  if (num > min)
  {
    var prevA = document.createElement("a");
    prevA.id = "prevPage";
    prevA.innerHTML = "Previous Page";
    prevA.style.marginLeft = "2px";
    prevA.style.marginRight = "2px";
    prevA.href = baseName + "_" + (num - 1) + ".html";
    theDiv.appendChild(prevA);
  }
  if (num < max)
  {
    var nextA = document.createElement("a");
    nextA.id = "nextPage";
    nextA.innerHTML = "Next Page";
    nextA.style.marginLeft = "2px";
    nextA.style.marginRight = "2px";
    nextA.href = baseName + "_" + (num + 1) + ".html";
    theDiv.appendChild(nextA);
  }
}

window.onload = init;
</script>
</head>

<body>
</body>
</html>
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
This article covers the basics of the Sass, which is a CSS extension language. You will learn about variables, mixins, and nesting.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question