<html>
<head>
<title>连连看-download by http://www.jb51.net</title>
<style>
.select{filter:Gray}
#lineDiv{height:20px}
.lineDot{position:absolute; background:#f60;padding:0;font-size:0;width:10px;height:10px}
#gridDiv{padding:50px;background:#000;border:5px solid #ccc}
#gridTalbe{background-repeat:no-repeat; background-position:center; margin:0}
#gridTalbe td{width:41px;height:50px;}
#gridTalbe img{width:40px; border-right:1px solid #666;}
body{ padding:0; margin:0}
</style>
</head>
<body>
<table width="100%" border="1">
<tr>
<td><div id="gridDiv"></div></td>
<td width="180" align="center" bgcolor="#CCCCCC"><input name="button" type="button" onClick="oGrid.shuffle()" value="洗牌"></td>
</tr>
</table>
<div id="lineDiv"></div>
<div id="debug"></div>
<script>
/************************************************************************
设计：tot
时间：2007-12-29
MSN：xiaotot@msn.com
************************************************************************/
//记录被选择图块的信息
var selectImg = "";
var selectX = 0;
var selectY = 0;
//图块宽度和高度，用来计算画线的位置
var stepX = 41;
var stepY = 50;
//初始化棋盘,只能以oGrid命名
var oGrid = new objGrid(16,8);
/*****************************功能函数*******************************************/
//数组元素随机排序,tot设计，修改请保留
function rndArray(arr){
var le = arr.length;
for(var i=0; i < le; i++){
var s = Math.floor(Math.random()*le);
var zx = arr[i].x;
var zy = arr[i].y;//这里不能写成z=arr[i],因为object是引用
arr[i].x = arr[s].x;
arr[i].y = arr[s].y;
arr[s].x = zx;
arr[s].y = zy;
}
}
//数组元素随机排序
function ArrayRnd(arr,times){
for(i = 0; i < times; i++)rndArray(arr)
}
//获取Html元素的绝对位置
function GetAbsoluteLocation(element){
if ( arguments.length != 1 || element == null ) return null;
var offsetTop = element.offsetTop;
var offsetLeft = element.offsetLeft;
var offsetWidth = element.offsetWidth;
var offsetHeight = element.offsetHeight;
while( element = element.offsetParent ) {
offsetTop += element.offsetTop;
offsetLeft += element.offsetLeft;
}
return {
absoluteTop: offsetTop,
absoluteLeft: offsetLeft,
offsetWidth: offsetWidth,
offsetHeight: offsetHeight
};
}
/*****************************封装对象*******************************************/
//方盘对象，用来放置图块，tot设计，修改请保留
function objGrid(width,height){
var imgNum = 32; //图块样式个数
var gridNum = width * height;
//初始化图块所用的图片名
var arrImg = new Array(imgNum);
for(i = 0;i < imgNum; i++) arrImg[i] = "llk_" + i;
//初始化图块数组
var arrImgBlock = new Array(gridNum);
for(i = 0; i< gridNum; i++){
arrImgBlock[i] = new objImgBlock(arrImg[Math.floor(i /4)]);
arrImgBlock[i].x = Math.floor(i / height);
arrImgBlock[i].y = i % height;
}
//打乱次序
ArrayRnd(arrImgBlock,5);
//生成方盘对象
var obj = new Object();
obj.backGround = "back.gif";//方盘的背景图片
obj.arrGrid = new Array(width);
//初始化方盘二维数组
for(i = 0; i < width; i++)
obj.arrGrid[i] = new Array(height);
//向放盘中放置图块
obj.init = function (arrBlock){
for(i = 0; i < width; i++)
for(j = 0; j < height; j++){
this.arrGrid[i][j] = "";
}
grid = arrBlock.length;
for(i = 0; i < grid; i++)
this.arrGrid[arrBlock[i].x][arrBlock[i].y] = arrBlock[i];
this.drawGrid()
this.setGridBackground(this.backGround)
}
//洗牌
obj.shuffle = function (){
var arrIBlock = new Array();
for(i = 0; i < width; i++)
for(j = 0; j < height; j++)
if(this.arrGrid[i][j] != "")arrIBlock.push(this.arrGrid[i][j]);
ArrayRnd(arrIBlock,5);
this.init(arrIBlock);
}
//查找最远射点
obj.findRadial = function (point){
var minX = -1, minY = -1, maxX = width, maxY = height;
//水平查找最远射点
for(i = 0; i < width; i++){
if(i < point.X){
if(this.arrGrid[i][point.Y] != "")
minX = point.X;
else{
if(minX == point.X) minX = i;
}
}else if(i > point.X){
if(this.arrGrid[i][point.Y] != ""){
maxX = i - 1;
break;
}
}
}
//垂直查找最远射点
for(i = 0; i < height; i++){
if(i < point.Y){
if(this.arrGrid[point.X][i] != "")
minY = point.Y;
else{
if(minY == point.Y) minY = i;
}
}else if(i > point.Y){
if(this.arrGrid[point.X][i] != ""){
maxY = i - 1;
break;
}
}
}
return {
MinX : minX,
MinY : minY,
MaxX : maxX,
MaxY : maxY
}
}
//查找法线
obj.findNormal = function(sPoint,ePoint){
var startPoint, endPoint
var sRadial = this.findRadial(sPoint);
var eRadial = this.findRadial(ePoint);
var pass;//是否可以通过标志
maxSX = Math.max(sRadial.MinX,eRadial.MinX)
minEX = Math.min(sRadial.MaxX,eRadial.MaxX);
maxSY = Math.max(sRadial.MinY,eRadial.MinY);
minEY = Math.min(sRadial.MaxY,eRadial.MaxY)
//查找横法线
if( maxSY <= minEY){
if(maxSY == -1){
startPoint = new objPoint(sPoint.X,-1);
endPoint = new objPoint(ePoint.X,-1);
}else if(minEY == height){
startPoint = new objPoint(sPoint.X,height);
endPoint = new objPoint(ePoint.X,height);
}
else{
for(j = maxSY; j <= minEY; j++){
pass = true;
for(i = Math.min(sPoint.X,ePoint.X) + 1; i < Math.max(sPoint.X,ePoint.X); i++){
if(this.arrGrid[i][j] != "") pass = false;
}
if(pass){
startPoint = new objPoint(sPoint.X,j);
endPoint = new objPoint(ePoint.X,j);
}
}
}
}//查找竖法线
else if( maxSX <= minEX){
if(maxSX == -1){
startPoint = new objPoint(-1,sPoint.Y);
endPoint = new objPoint(-1,ePoint.Y);
}else if(minEX == width){
startPoint = new objPoint(width,sPoint.Y);
endPoint = new objPoint(width,ePoint.Y);
}
else{
for(i = maxSX; i <= minEX; i++){
pass = true;
for(j = Math.min(sPoint.Y,ePoint.Y) + 1; j < Math.max(sPoint.Y,ePoint.Y); j++){
if(this.arrGrid[i][j] != "") pass = false;
}
if(pass){
startPoint = new objPoint(i,sPoint.Y);
endPoint = new objPoint(i,ePoint.Y);
}
}
}
}
//返回法线端点
if(startPoint){
return{sP : startPoint, eP : endPoint}
}
else {return false};
}
//画方盘
obj.drawGrid = function (){
var gDiv = document.getElementById("gridDiv");
var tempHtml = "<table id=gridTalbe border=0 cellpadding=0 cellspacing=0 align=center>";
for(i = 0; i < height; i++){
tempHtml += "</tr>";
for(j = 0; j < width; j++){
tempHtml += "<td>";
if(this.arrGrid[j][i] != "")
tempHtml += this.arrGrid[j][i].toHtml();
tempHtml += "</td>";
}
tempHtml += "</tr>";
}
tempHtml += "</table>";
gDiv.innerHTML = tempHtml;
}
//设置背景
obj.setGridBackground = function(img){
var gTable = document.getElementById("gridTalbe");
gTable.style.backgroundImage = "url(images/" + img + ")";
this.backGround = img;
}
//执行初始化
obj.init(arrImgBlock);
return obj;
}
//图块对象
function objImgBlock(pic){
var obj = new Object();
obj.picName = pic;
obj.x = 0;
obj.y = 0;
obj.toHtml = function(){
return "<img name=" + this.picName + " onclick=clickImg(" + this.x + "," + this.y + ") src=images/"
+ this.picName + ".gif>"
}
return obj;
}
//坐标点对象，对应于承载图块的二元数组下标
function objPoint(x,y){ return{ X : x, Y : y }}
//点击图块的动作
function clickImg(x,y){
eObj = event.srcElement;
if((selectImg.name == eObj.name) && (selectImg !== eObj)){
if(Line(new objPoint(selectX,selectY),new objPoint(x,y))){
selectImg.style.display = "none";
eObj.style.display = "none";
selectImg = "";
selectX = 0; selectY = 0;
}else changeSelect(eObj,x,y)
}else{
changeSelect(eObj,x,y)
}
}
//更换选择的图块
function changeSelect(o,x,y){
selectImg.className = "";
selectImg = o;
selectImg.className = "select";
selectX = x; selectY = y;
}
llk.rar_javascript_llk连连看_连连看游戏
版权申诉
199 浏览量
2022-09-22
22:28:46
上传
评论
收藏 75KB RAR 举报
llk.rar （35个子文件） 
llk images 
llk_6.gif 2KB llk_2.gif 2KB llk_0.gif 2KB llk_18.gif 2KB llk_16.gif 2KB llk_28.gif 2KB llk_8.gif 2KB llk_11.gif 2KB llk_21.gif 2KB llk_9.gif 2KB llk_3.gif 2KB llk_23.gif 2KB llk_31.gif 2KB llk_27.gif 2KB llk_20.gif 2KB llk_22.gif 2KB llk_25.gif 2KB llk_13.gif 2KB llk_19.gif 2KB ico-arrow.gif 9KB llk_7.gif 2KB llk_26.gif 2KB llk_14.gif 2KB llk_17.gif 2KB llk_10.gif 2KB llk_1.gif 2KB llk_30.gif 2KB llk_12.gif 2KB llk_5.gif 2KB llk_24.gif 2KB llk_15.gif 2KB llk_29.gif 2KB llk_4.gif 2KB back.gif 5KB
llk.htm 10KB资源评论
