// get object for IE and NS > 4
function g_obj(id) {
	var l_obj = null;
	if (document.getElementById) l_obj = document.getElementById(id);
  else if (document.all) l_obj = document.all[id];
  else if (document.layers) l_obj = document.layers[id];
  return l_obj;
  }

// get object collections by tag for IE and NS > 4
function g_objs_tag(p_tag) {
	var l_objs = null;

  // find all body sections
  if (document.getElementsByTagName) {
	  l_objs = document.getElementsByTagName(p_tag);
	  }
  else if (document.all) {
	  l_objs = document.all.tags(p_tag);
	  }
  else {
    return null;
    }
  return l_objs;
  }

// hide loading layer, show actual page
function on_load() {
  var l_q_tags;
  var l_cnt;
  
  // hide_loading_page
  g_obj('layer_loading').style.visibility = "hidden";
  g_obj('layer_page').style.visibility = "visible";

  // set color and event handlers for keywords (all <p> tags)
  l_q_tags = g_objs_tag('q');
  for (l_cnt = 0; l_cnt < l_q_tags.length; l_cnt++) {
    l_q_tags[l_cnt].style.color = "#00C6FF";
    l_q_tags[l_cnt].onmouseover = highlight;
    l_q_tags[l_cnt].onmouseout = lowlight;
    }
  }

// highlight the keyword using the Traditional event model
function highlight(p_event) {
  // set object properties
  this.style.border = "1px solid red";
  this.style.color = "#00C6FF";
  }

// lowlight the keyword using the Traditional event model
function lowlight(p_event) {
  // set object properties
  this.style.border = "";
  this.style.color = "#00C6FF";
  }

// show one of the pre-loaded images
function show_image(p_id) {
  if (g_obj('my_image').src != "screenshots/" + p_id + ".gif") g_obj('my_image').src = "screenshots/" + p_id + ".gif";
  }

// scroll image
function scroll_image() {
  var l_pos_y;
  var l_height;
	
	// get current page scroll position for IE and NS > 4
	if (window.innerHeight) {
		l_pos_y = window.pageYOffset;
		l_height = window.innerHeight;
	  }
	else if (document.documentElement && document.documentElement.scrollTop) {
		l_pos_y = document.documentElement.scrollTop;
		l_height = document.documentElement.clientHeight;
	  }
	else if (document.body) {
		l_pos_y = document.body.scrollTop;
		l_height = document.body.clientHeight;
    }
	
	if (l_height > g_obj('my_image').height + 60) {
    // set new height
    g_obj('layer_image').style.top = l_pos_y;
    g_obj('copyright').style.top = l_pos_y;
    }

  l_pos_y = null;
  l_height = null;
  }

// detect if browser supports DHTML
function check_browser_support() {
  var l_dhtml = (document.getElementById || document.all || document.layers);
  if (l_dhtml) {
    set_events();
    }
  else {
    //document.writeln("Your browser does not support Dynamic Hypertext Markup Language (DHTML)");
    }
  }

// install events the 'traditional' way
function set_events(){
  window.onload = on_load;
  window.onscroll = scroll_image;
  }

// invoke
check_browser_support();