Someone

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<cfquery datasource="humsoc" name="imager">
select *
from dog
</cfquery>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function P7_autoLayers() { //v1.5 by PVII
 var g,b,k,f,u,k,j,args=P7_autoLayers.arguments,a=parseInt(args[0]);if(isNaN(a))a=0;
 if(!document.p7setc){p7c=new Array();
 document.p7setc=true;
 for(u=0;u<10;u++){ p7c[u]=new Array();
 }}for(k=0;k<p7c[a].length;k++){if((g=MM_findObj(p7c[a][k]))!=null){
 b=(document.layers)?g:g.style;
 b.visibility="hidden";
 }}for(k=1;k<args.length;k++){
 if((g=MM_findObj(args[k]))!=null){b=(document.layers)?g:g.style;
 b.visibility="visible";f=false;
 for(j=0;j<p7c[a].length;j++){if(args[k]==p7c[a][j]) {f=true;}}
 if(!f){p7c[a][p7c[a].length++]=args[k];}}}
}

function P7_hideEl(evt) { //v1.7 by PVII-www.projectseven.com
 var b,r,m=false;if(document.layers){b=evt.target;if(b.p7aHide){
 b.visibility="hidden";}else{routeEvent(evt);}
 }else if(document.all&&!window.opera){b=event.srcElement;while(b){
 if(b.p7aHide){break;}b=b.parentElement;}if(!b.contains(event.toElement)){
 b.style.visibility="hidden";}}else if(document.getElementById){
 b=evt.currentTarget;r=evt.relatedTarget;while(r){if(b==r){m=true;
 break;}r=r.parentNode;}if(!m){b.style.visibility="hidden";}}
}

function P7_autoHide() { //v1.7 by PVII-www.projectseven.com
 var i,g;for(i=0;i<arguments.length;i++){
 if((g=MM_findObj(arguments[i]))!=null){g.p7aHide=true;if(document.layers){
 g.captureEvents(Event.MOUSEOUT);}
 if(g.addEventListener){g.addEventListener("mouseout",P7_hideEl,true);
 }else if(g.attachEvent){g.attachEvent("onmouseout",P7_hideEl);
 }else{g.onmouseout=P7_hideEl;}}}
}
//-->
</script>
</head>


<body onLoad="MM_preloadImages(<cfoutput query="imager">'images/#right(pic,len(pic)-62)#',</cfoutput>;<cfoutput query="imager">P7_autoHide('preview#num#m');</cfoutput>">
<cfoutput query="imager">
  <CFSET max_roller = #imager.recordcount#>
  <CFSET max_rows = INT((#max_roller# +3)/4)>
</cfoutput>
<CFSET x = 1>
<div id="container">
<TABLE width="650" border="4" cellpadding="4">
<CFLOOP INDEX="roller_no" FROM="1" TO="#max_rows#">
  <TR>
    <CFLOOP INDEX="roller" FROM="1" TO="4">
      <CFSET x = x + 1>
      <CFQUERY NAME="build" DATASOURCE="humsoc">
      SELECT * FROM dog
      WHERE num = #x#
      </CFQUERY>
      <cfoutput query="build">
        <td align="center"><a onmouseover="P7_autoLayers(0,'preview#x#m')" onMouseOut="P7_autoLayers(0)"><img src='images/#right(thumb,len(thumb)-62)#' height="50"><br />
          #id#<br />
          #breed#</a></td>
      </cfoutput>
    </CFLOOP>
  </TR>
</CFLOOP>
</TABLE>
</div>
<cfset z=1>
<CFLOOP INDEX="roller_no" FROM="1" TO="#max_rows#">
  <CFLOOP INDEX="roller" FROM="1" TO="4">
      <CFSET z = z + 1>
      <CFQUERY NAME="build" DATASOURCE="humsoc">
      SELECT * FROM dog
      WHERE num = #z#
      </CFQUERY>
      <cfoutput query="build">
<div id="preview#z#m" style="position:absolute; left: 40%;top:35%;"> 
  <TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0>
    <TR>
      <TD valign="top" background="images/preview1_03.jpg"> #id# </TD>
    </TR>
    <TR>
      <TD valign="top"  background="images/preview1_05.jpg"> #info#</TD>
    </TR>
    <TR>
      <TD><IMG SRC="images/#right(pic,len(pic)-62)#" WIDTH="250" ALT=""></TD>
    </TR>
  </TABLE>
 </div>
 <script language="javascript">
 start();
 </script>
 </cfoutput>
  </CFLOOP>
</CFLOOP>
  
</body>