Creating a Mosaic Webpage with Javascript

If you are hosting a couple of websites, you want to make sure that adding or editing website configurations (e.g. Apache config files) does not interfere with other websites.

To display an overview of hosted sites, I decided to write a Javascript procedure which creates a table containing iframes to those websites:

        <link rel="stylesheet" href="stylesheet.css" type="text/css">
        <table id="Table1" cellSpacing="1" cellPadding="1" width="100%" border="0">
        <script type="text/javascript">
var sites = [];
sites["site1"] = "";
sites["site2"] = "";
// more sites

var iMaxCol = 2;
var iCol = 0;

for(site in sites)
    if (iCol == 0) {

    document.writeln("<td align=\"center\">");
    document.writeln("<a href=\"" + sites[site] +
        "\" target=\"_blank\">" + site + "</a><br/>");
    document.writeln("<iframe src=\"" + sites[site] +
        "\" width=\"100%\" height=\"100px\"");

    if (iCol == iMaxCol) {
        iCol = 0;

if (iCol == iMaxCol) {

One Response to Creating a Mosaic Webpage with Javascript

  1. […] a Mosaic Webpage with Javascript using DOM I tried to present my concept of a Mosaic Webpage today, and found that while it renders nicely in Firefox, Internet Explorer (6,7,8) only showed a […]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: