Google Map模拟--IT公司查询，IT排名，面试题目，统计信息!

京津冀晋内蒙古辽吉黑沪苏浙皖闽赣鲁豫鄂湘粤桂琼川贵滇藏陕甘青宁新台港澳渝其他

首页

公司列表

红黑排名

面试宝典

技术专栏

网站估值

联系我们

[搜索] [Google 站内搜索]

添加新公司

Google Map模拟

fram.html:

<html>

<head>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
<title>新建网页 1</title>
<script language=javascript>
function forbiddenclick() { //函数功能，如果当前点击右键，返回false
if (event.button==2)
{
return false;
}
}
document.onmousedown=forbiddenclick;//禁止右键
document.onselectstart=returnFalse; //禁止文档选择
function returnFalse() { return false; }
document.oncontextmenu=new Function('event.returnValue=false;');//禁止右键动作
</script>
</head>

</html>

index.htm:

<html>
<title>smooth2</title>
<head>
<SCRIPT language=JavaScript1.2>
<!--
document.onselectstart=returnFalse;
function returnFalse() { return false; }
document.oncontextmenu=new Function('event.returnValue=false;');

var ie=document.all
var ns6=document.getElementById&&!document.all

///////控制层的拖动
var xN,yN; //设置了层的规格
var picWidth=2600; //整个大图的宽度2592
var picHeight = 2000; //整个大图的高度1944
var viewWidth = 490;
var viewHeight = 400; //定义了浏览框的尺寸
var sX,sY,sZ //这里是一个mission的全局控制量，浏览视窗相对大图所在的位置,以左上为基准
var fX,fY //用来记录载入图片的索引
var dragapproved=false
var z,x,y
var temp1,temp2

function definePosition(diva,divX,divY){  //根据层被拖动后的位置，调整层的定位，以及决定是否需要重载图片
sX -= parseInt(divX,10)-temp1;
sY -= parseInt(divY,10)-temp2;
var re = true;
if(divX>0)
{
  diva.style.left = divX - (Math.floor(divX/200)+1)*200;
  fX -= Math.floor(divX/200)+1;

  //diva.style.left = divX - (Math.floor(divX/200)+((divX%200==0)?0:1))*200;
  //fX -= Math.floor(divX/200)+((divX%200==0)?0:1);
  re = false;
}
else if(divX<viewWidth-200*xN)
{

  diva.style.left = divX + (Math.floor((viewWidth-200*xN-divX)/200)+1)*200;
  fX += Math.floor((viewWidth-200*xN-divX)/200)+1;

  //diva.style.left = divX + (Math.floor((viewWidth-200*xN-divX)/200)+((viewWidth-200*xN-divX)%200==0?0:1))*200;
  //fX += Math.floor((viewWidth-200*xN-divX)/200)+((viewWidth-200*xN-divX)%200==0?0:1);
  re = false;
}

if(divY>0)
{
  diva.style.top = divY - (Math.floor(divY/200)+1)*200;
  fY -= Math.floor(divY/200)+1;

  //diva.style.top = divY - (Math.floor(divY/200)+((divY%200==0)?0:1))*200;
  //fY -= Math.floor(divY/200)+((divY%200==0)?0:1);

  re = false;
}
else if(divY<viewHeight-200*yN)
{
  diva.style.top = divY + (Math.floor((viewHeight-200*yN-divY)/200)+1)*200;
  fY += Math.floor((viewHeight-200*yN-divY)/200)+1;

  //diva.style.top = divY + (Math.floor((viewHeight-200*yN-divY)/200)+((viewHeight-200*yN-divY)%200==0?0:1))*200;
  //fY +=Math.floor((viewHeight-200*yN-divY)/200)+((viewHeight-200*yN-divY)%200==0?0:1);
  re = false;

}
return re;
}

function drags(eventObject){
if(eventObject.button==1&&eventObject.srcElement.tagName.toString()=='IMG'){
temp1=parseInt(moveDiva.style.left,10);
temp2=parseInt(moveDiva.style.top,10);
x=parseInt(eventObject.clientX,10);
y=parseInt(eventObject.clientY,10);
dragapproved = true;
moveDiva.setCapture();
}
return false;
}

function divaMouseup(eventObject){
if(eventObject.button==1&&dragapproved)
{
dragapproved=false;
moveDiva.releaseCapture();
checkOutYN();
if(!definePosition(moveDiva,parseInt(moveDiva.style.left,10),parseInt(moveDiva.style.top,10)))reloadPic(fX,fY);
}

return;
}

function divaMove(eventObject){
if(dragapproved &&eventObject.button==1)
  {
   moveDiva.style.left=temp1+parseInt(eventObject.clientX,10)-x;
   moveDiva.style.top=temp2+parseInt(eventObject.clientY,10)-y;
  }
return;
}

function checkOutYN(){
var changedX = sX-parseInt(moveDiva.style.left,10)+temp1;
var changedY = sY-parseInt(moveDiva.style.top,10)+temp2;

if(changedX<=0)
{
moveDiva.style.left = temp1+sX;
}
else if(changedX>=picWidth-viewWidth)
{
moveDiva.style.left =temp1-(picWidth-viewWidth-sX);
}
if(changedY<=0)
{
moveDiva.style.top = temp2+sY;
}
else if(changedY>=picHeight-viewHeight)
{
moveDiva.style.top=temp2-(picHeight-viewHeight-sY);
}
return true;
}
//-->

function reloadPic(formatX,formatY){ //当确定需要重载图片后,进行载入图片

for(i=1;i<=yN;i++)
{
  for(j=1;j<=xN;j++)
  {
   document.getElementById('pic'+i+'_'+j).src = 'images/'+(fY+i).toString()+'_'+(fX+j).toString()+'.jpg';
  }
}
}

function loadPic(sessionX,sessionY,sessionZ){ //此函数用于根据当前层的位置,载入相应的图片divX、divY表示层的当前位置
           //divZ表示当前所处的放大倍数，xNum和yNum则显示了当前层需要载入图片的规格
var startX = Math.floor(sessionX/200);
fX = startX;
var startY = Math.floor(sessionY/200);
fY = startY;
for(i=1;i<=yN;i++)
{
  for(j=1;j<=xN;j++)
  {
   document.getElementById('pic'+i+'_'+j).src = 'images/'+(startY+i).toString()+'_'+(startX+j).toString()+'.jpg';
  }
}

}

function initialization(sessionX,sessionY,xNum,yNum){  //初始化元素，xNum和yNum指定了载入图片的数量
var iniStr = '<table border=\'0\' width=\'100%\' id=\'table1\' cellspacing=\'0\' cellpadding=\'0\' onselect=\'return false;\'>';
for(i=1;i<=yNum;i++)
{
  iniStr += '<tr>';
  for(j=1;j<=xNum;j++)
   {
    iniStr += '<td width=\'200\' height=\'200\'>';
    iniStr += '<img id=\'pic'+i+'_'+j+'\' width=\'100%\' height=\'100%\' onerror=\'this.src='images/spacer.gif'\'>';
    iniStr += '</td>';
   }
  iniStr += '</tr>';
}
iniStr += '</table>';

document.getElementById('moveDiva').style.width = 200*xNum;
document.getElementById('moveDiva').style.height = 200*yNum;
document.getElementById('moveDiva').innerHTML = iniStr;
xN = xNum;
yN = yNum;
sX = sessionX;
sY = sessionY;
moveDiva.style.left = -sX%200;
moveDiva.style.top = -sY%200;
loadPic(sessionX,sessionY,1);
}
//-->

</SCRIPT>
</head>
<body leftmargin='0' topmargin='0' bgcolor='#FFFFCC'>
<div id='moveDiva' onmousedown='drags(event)' onmousemove='divaMove(event)' onmouseup='divaMouseup(event)' style=' LEFT:0px; POSITION:absolute; TOP:0px;background:#cc0000; Z-INDEX:1'>
loading HTML...
</div>

</body>
</html>
<script language='javascript'>
initialization(1640,850,4,4);
</script>