Delphi/docs/tutorial01/index.html

<html> 
<head> 
<title>xxm tutorial quick guide screenshots</title> 
<style type="text/css"><!--
BODY{font-family:Calibri,Verdana,sans-serif;font-size:16pt;overflow:hidden;}
P{text-align:center;margin:0pt;}
P#tutnav{font-size:12pt;}
IMG#tutsnap{border:2px solid #999999;}
A{text-decoration:none;}
//--></style> 
<body onresize="doresize();" onhashchange="nav(document.location.hash.substr(1));"> 
<p id="tutnav"><i>loading...</i></p> 
<p><img src="snap00.png" id="tutsnap" width="800" height="600" onclick="nav(csnap+1);" /><img src="snap01.png" id="tutpre" width="0" height="0" /></p> 
<p id="tuttxt"></p> 
<script language="javascript" src="snaps.js"></script> 
<script language="javascript"><!--
var tutnav=document.getElementById("tutnav");
var tutsnap=document.getElementById("tutsnap");
var tuttxt=document.getElementById("tuttxt");
var tutpre=document.getElementById("tutpre");
var csnap=0;
function doresize()
{
	var x=tutnav.clientWidth;
	if(x==0)x=tutnav.offsetWidth;
	if(x<800)
	{
		tutsnap.width=x;
		tutsnap.height=x*0.75;
	}
	else if(tutsnap.width!=800)
	{
		tutsnap.width=800;
		tutsnap.height=600;
	}
}
function buildnav()
{
	var i;
	var x=(csnap==0)?'<s>[prev]</s>':('<a href="javascript:nav('+(csnap-1)+');">[prev]</a>');
	for(i=0;i<snaps.length;i++) x+=" "+((csnap==i)?('<b>['+i+']</b>'):('<a href="javascript:nav('+i+');">['+i+']</a>'));
	tutnav.innerHTML='<a href="..">[back]</a> '+x+' '+((csnap==snaps.length-1)?'<s>[next]</s>':('<a href="javascript:nav('+(csnap+1)+');">[next]</a>'));
}
function nav(x)
{
	if(x<snaps.length&&csnap!=x)
	{
		csnap=x;
		document.location.hash="#"+x;
		tutsnap.src="snap"+new String(100+x).substr(1,2)+".png";
		tuttxt.innerHTML=snaps[x];
		buildnav();
		if(x+1<snaps.length)tutpre.src="snap"+new String(101+x).substr(1,2)+".png";
	}
}
doresize();
buildnav();
tuttxt.innerHTML=snaps[csnap];
if(document.location.hash)nav(new Number(document.location.hash.split("#")[1]));
//--></script> 
</body>