首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

闲着蛋疼,用JQUERY写个小小游戏,要分的来咯!

2012-02-16 
闲着蛋疼,用JQUERY写个小小游戏,要分的来咯! - Web 开发 / Ajax今晚闲着蛋疼,长夜漫漫,无心睡眠,写了个JQU

闲着蛋疼,用JQUERY写个小小游戏,要分的来咯! - Web 开发 / Ajax
今晚闲着蛋疼,长夜漫漫,无心睡眠,写了个JQUERY插件,给同学们一个小小游戏。

效果图:


玩法:


插件代码:

JScript code
$.fn.game = function(options){    var parms = {        block:"block",        atler:"#E3E3E3",        width:40,        height:40,        row:0,        cell:0,        time:60    };    if(options) {        $.extend(parms, options);    };    var _this = $(this);    var _score = 0;    var _scoreFrame = 0;    var _timeFrame;    var _timeContent;    var _timeUse = parms.time;    var _time;    var _table;    var _tr;    var _td;    var _random;    var color = [        { index:1, rgb:"#006600" },        { index:2, rgb:"#006666" },        { index:3, rgb:"#990000" },        { index:4, rgb:"#663399" },        { index:5, rgb:"#FF6600" },        { index:6, rgb:"#000" }    ];    var initStatus = function()    {        _scoreFrame = $("<div/>").css("margin-bottom","10px").css("color","#FF0000").css("font-family","微软雅黑").html("分数:"+_score).appendTo(_this);        _timeFrame = $("<div/>").css("width","500").css("height","20").css("padding","1px").css("margin-bottom","10px").css("border","1px #ccc solid").appendTo(_this);        _timeContent = $("<div/>").css("width","100%").css("height","20").css("background","#009900").appendTo(_timeFrame);        _time = setInterval(changeTime,1000);    }        var changeTime = function()    {        if(_timeUse>0)        {            _timeUse--;            _timeContent.css("width",(_timeUse/parms.time)*100+"%");        }        else        {            alert("Sorry,时间到了!");            clearInterval(_time);        }    }    var initBlock = function()    {        _table = $("<table/>").attr("id",parms.block).attr("cellPadding","0").attr("cellSpacing","0").css("border","1px #ccc solid").appendTo(_this);        for(var i=0; i<parms.row; i++)        {            _tr = $("<tr/>").appendTo(_table);            for(var j=0; j<parms.cell; j++)            {                _td = $("<td/>").attr("id",i+"-"+j).css("width",parms.width).css("height",parms.height).appendTo(_tr);                _td.click(function(){                    clickFunc(this.id);                });                if((parseInt(i)+parseInt(j))%2==0)                {                    _td.css("background",parms.atler);                }                if(random(20)<10)                {                    _random = random(color.length);                    _td.attr("id",i+"-"+j+"-"+color[_random-1].index);                    _td.css("background",color[_random-1].rgb);                    _td.unbind("click");                }            }        }    }        var selectRowCell = function(row,cell)    {        return $("#block tr:eq("+row+") td:eq("+cell+")");    }        var clickFunc = function(id)    {        if(typeof id != "string") return;        var _arr = id.split('-');        var _current,_left,_right,_top,_bottom;        var _left_id,_right_id,_top_id,_bottom_id;        for(var i=_arr[1]-1; i>=0; i--)        {            _current = selectRowCell(_arr[0],i);            if(_current.attr("id").split('-').length>2)            {                _left = _current;                _left_id = _current.attr("id").split('-')[2];                break;            }        }        for(var i=parseInt(_arr[1])+1; i<parms.cell; i++)        {            _current = selectRowCell(_arr[0],i);            if(_current.attr("id").split('-').length>2)            {                _right = _current;                _right_id = _current.attr("id").split('-')[2];                break;            }        }        for(var i=_arr[0]-1; i>=0; i--)        {            _current = selectRowCell(i,_arr[1]);            if(_current.attr("id").split('-').length>2)            {                _top = _current;                _top_id = _current.attr("id").split('-')[2];                break;            }        }        for(var i=parseInt(_arr[0])+1; i<parms.row; i++)        {            _current = selectRowCell(i,_arr[1]);            if(_current.attr("id").split('-').length>2)            {                _bottom = _current;                _bottom_id = _current.attr("id").split('-')[2];                break;            }        }        if(_left_id==_top_id&&_left_id==_right_id&&_left_id==_bottom_id)        {            action(_left);            action(_right);            action(_top);            action(_bottom);            _score = _score+4;            setScore();            return;        }        else if(_left_id==_top_id&&_left_id==_right_id)        {            action(_left);            action(_top);            action(_right);            _score = _score+3;            setScore();            return;        }        else if(_left_id==_top_id&&_left_id==_bottom_id)        {            action(_left);            action(_top);            action(_bottom);            _score = _score+3;            setScore();            return;        }        else if(_left_id==_right_id&&_left_id==_bottom_id)        {            action(_left);            action(_right);            action(_bottom);            _score = _score+3;            setScore();            return;        }        else if(_right_id==_top_id&&_right_id==_bottom_id)        {            action(_right);            action(_top);            action(_bottom);            _score = _score+3;            setScore();            return;        }        else if(_left_id==_top_id)        {            action(_left);            action(_top);            _score = _score+2;            setScore();            return;        }        else if(_left_id==_right_id)        {            action(_left);            action(_right);            _score = _score+2;            setScore();            return;        }        else if(_left_id==_bottom_id)        {            action(_left);            action(_bottom);            _score = _score+2;            setScore();            return;        }        else if(_top_id==_right_id)        {            action(_right);            action(_top);            _score = _score+2;            setScore();            return;        }        else if(_top_id==_bottom_id)        {            action(_top);            action(_bottom);            _score = _score+2;            setScore();            return;        }        else if(_right_id==_bottom_id)        {            action(_right);            action(_bottom);            _score = _score+2;            setScore();            return;        }    }        var setScore = function()    {        _scoreFrame.html("分数:"+_score)    }        var action = function(obj)    {        if(typeof obj == "undefined") return;        var _idArr = obj.attr("id").split('-');        obj.attr("id","1111");        obj.css("background",(parseInt(_idArr[0])+parseInt(_idArr[1]))%2==0?parms.atler:"#fff");        obj.click(function(){                    clickFunc(_idArr[0]+"-"+_idArr[1]);                });    }        var random = function(n)    {        return Math.floor(Math.random()*n+1);    }        initStatus();    initBlock();} 



调用:
HTML code
<div id="t"></div>


JScript code
$("#t").game({row:10,cell:20});


还有许多小BUG,有已经发现的和未发现的,以及参数说明,都放到明天再说了,好困,睡去了,晚安 =.=

[解决办法]
板凳 不错。。多谢LZ分享
[解决办法]
发现我还没睡,然后SF被抢,坐个板凳算了
[解决办法]
探讨

板凳 不错。。多谢LZ分享

[解决办法]
子夜每天日常 刷版了,呵呵,睡觉去了
[解决办法]
牛~~3点多还有人玩抢楼。

[解决办法]
抢楼
看看咯
[解决办法]
看看 
支持原创

[解决办法]
学习。
[解决办法]
蛋疼是一种病 割了就好了
[解决办法]
牛~~3点多还有人玩抢楼
[解决办法]
接分。
[解决办法]
牛 - - Java不会用、 还是易语言简单
[解决办法]
强人啊,来接分
[解决办法]
谢谢 学学习习
[解决办法]
来收点分吧。。。
[解决办法]
接分!
[解决办法]

不错。。。支持。。。
[解决办法]
支持原创,顶楼主!
[解决办法]
厉害LZ
[解决办法]
支持
学习

[解决办法]
打劫个分
[解决办法]
二连发,继续打劫
[解决办法]
还是打劫,三连发,劫财劫色劫内裤
[解决办法]
你们太牛了3点还在
[解决办法]
接分。。。
[解决办法]
JF

[解决办法]
up..........
[解决办法]
Thanks for sharing
[解决办法]
新人报道!!!!
------解决方案--------------------


谢谢 share
[解决办法]
哎哟 哎哟
[解决办法]
你太牛了长夜漫漫没有玩的就玩这个吧
[解决办法]

探讨
牛 - - Java不会用、 还是易语言简单

[解决办法]
接 分
[解决办法]
汗滴滴

探讨
牛 - - Java不会用、 还是易语言简单

[解决办法]
有时我也会为突如其来的想法冲昏头脑,就想着尽快完成。坦诚说我不支持楼主这样,身体要紧,希望以后不要再蛋疼了~
[解决办法]
接分
[解决办法]
接分,谢谢分享!
[解决办法]

太专业了,3、4点还在,要注意身体哦!
[解决办法]
haha
[解决办法]
5秒钟粗看

一个面向对象的好程序


赞一个,收了
[解决办法]
不错!
[解决办法]
jQuery用的不错~
[解决办法]
感谢分享
[解决办法]
收藏,谢谢分享。。。
[解决办法]
不错。。。
[解决办法]
学习了
[解决办法]
学习+++++++++++++++++++++++++++++++++++++++++++++=接分
[解决办法]
楼主很敬业。。。接分
[解决办法]
多谢LZ分享
[解决办法]
多谢楼主分享哈!
[解决办法]
还真的不错呢
[解决办法]
这就是传说中的自慰游戏吗吗吗吗吗吗
[解决办法]
很强大,学习学习!
[解决办法]
大晚上 不睡觉 我就蛋疼
[解决办法]
很强大,一定要学习!
[解决办法]
太有才了....
[解决办法]

[解决办法]
顶!!!!!!!!接分!
[解决办法]
63636363
[解决办法]

[解决办法]
646464
------解决方案--------------------



[解决办法]

[解决办法]
呵呵,牛x
[解决办法]
好........
[解决办法]
路过,围观
[解决办法]
JF!

[解决办法]
求分!!!!
[解决办法]
挺不错
[解决办法]
能给分吗

[解决办法]

[解决办法]
定 快快快快快快快快快快快快快快快快快快jjjkokpklakj会计加快科技快乐就好啦 离开家阿里加快了福建省电力局
[解决办法]
牛人哪!!给点分

[解决办法]
注意身体呀
[解决办法]
只是为分..............
[解决办法]
闲着学点有用的东西,别糟蹋时间.....
[解决办法]
JF、、、、、、、

[解决办法]
LZV5.....
[解决办法]

[解决办法]
这个怎么用来着?来个人详细说明下呀!
[解决办法]
不错 楼主加油!
[解决办法]
不错。。。。。。
[解决办法]
不错,把那图改成水果之类的,不然色盲还真玩不了
[解决办法]
不错啊,lsl sls
[解决办法]
接分帮顶
[解决办法]
接分。
[解决办法]
感觉网游还是flash的给力点!
[解决办法]
恩、、、不错。大神啊!
[解决办法]
hao
[解决办法]
mark!
[解决办法]
厉害、厉害,接点分
[解决办法]
厉害哦,看看试试
[解决办法]
凌晨三四点还玩抢楼
[解决办法]
收藏,V5

热点排行