Loading a Random HTML Page Inline

programming web dev
1

First off, thank you for posting this tutorial on how to load random HTML pages into a div.

http://www.kirupa.com/html5/loading_random_page_inline_pg1.htm

I got it to work if the pages I want to load are on the root, however I need to randomize 150 pages, so I would like to shove them into a folder for a cleaner server.

Here is the code which tells which pages to grab:

function loadExternalHTMLPage() {
var xmlhttp;
var pagesToDisplay = [‘sample1.htm’, ‘sample2.htm’];
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById(“featuredArtist”).innerHTML = xmlhttp.responseText;
}
}
var randomnumber = Math.floor(Math.random() * pagesToDisplay.length);
xmlhttp.open(“GET”, pagesToDisplay[randomnumber], true);
xmlhttp.send();
}

Since I will be using 150 different pages, I want these pages in a directory named “featured”, but the sample pages won’t show as soon as I enter a directory (shown below). Is this not the way to approach this in javascript?

var pagesToDisplay = [’…/featured/sample1.htm’, ‘…/featured/sample2.htm’];

I have tried these formats:

’featured/sample1.htm’ & '/featured/sample1.htm

I have even tried placing the ‘inline.js’ into the featured folder but it stills calls the pages from the root not /featured.

Any help would be much appreciated!

Thanks!
Damon