var xmlHttp

function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  } 
var url="picture.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);

// visibility depending on length of input string
var toggle = str.length % 2;

// try "hidden"/"collapse"
if (toggle == 1) document.getElementById("float").style.visibility = "visible";
else document.getElementById("float").style.visibility = "hidden";

// Note: Objects with "absolute" layout have no effect on positioning of other objects.
// Relative layout affects the entire page; including size fluctations below the object
// as well as allocation of space for the size of the object itself!

} 

// separate function for pop-up menu
function menuAppear(menuID) {
	document.getElementById("popup" + menuID).style.visibility = "visible";
}
function menuOut(menuID) {
	document.getElementById("popup" + menuID).style.visibility = "hidden";
}

// how to automatically place the menu in the proper position???
// (we don't want to have to deal with manual calcuations...)
function menuLoad() {
	//document.getElementById("popup").style.top = 500;
	//document.getElementById("popup").style.left = 500;
}

// from w3schools.com
function stateChanged() 
{ 
if (xmlHttp.readyState==4)
{ 

document.getElementById("testPic").src=xmlHttp.responseText;

}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}