JavaScript实例教程:javascript制作纸牌游戏

好几天没有更新自己的博客了，这段时间，作业比较多，试验报告比较多，老师要写纸质试验报告，还要电子档，考试不按照她上课讲的思路那就得不到几分。。。她这观点一出来，我就傻了，不能有自己的见解了。。。

废话就到这里，小小抱怨一下，o(∩_∩)o下面进入正题，这几天忙着做了一个JavaScript的纸牌。与Windows的纸牌相似

规则如下：

1.有3个叠牌区域和4种牌，左上角叠牌区，右上角整理区，和中间的层叠区。

2.层叠区有两种牌，掀开的纸牌和没有掀开的纸牌。

3.游戏的目的是将所有牌放入右上角的整理区（将层叠区的暗牌全部掀开）。

4.左上角的叠牌区域可以选择每次翻一张牌和翻三张牌。如果翻三张牌，只能移动翻开的三张中最上面的那一张。所以翻三张难度较大。

5.中间叠牌区域移动规则是：只有一张牌在顺序上是翻开纸牌最上面的那一张的下一张并且颜色不同，才可以移动。顺序是K,Q,J,10,9,8,7,6,5,4,3,2,A。

6.右上角的整理区移动规则是：只有一张牌在顺序上是最上面的那一张的上一张并且花色相同，才可以移动。顺序是A,2,3,4,5,6,7,8,9,10,J,Q,K。

7.最终将所有的牌移动到右上角算赢（只要将所有的纸牌都翻开后很容易就移到右上角）。

下面看具体的效果：点击查看

说明：由于IE内核的浏览器（包括IE9，除了IE10）对CSS3支持的并不是很好，所以建议使用IE10（当然除非你跟我一样有Windows8啰，呵呵）或者其他非IE内核的浏览器，比如Chrome/FireFox/Opera/Safari.

下面是测试的截图：

Windows8+IE10测试

Windows8+IE10测试

Windows8+IE10测试

Windows7+Chrome测试

Windows7+Chrome测试

Windows7+Chrome测试

转自我的博客：http://www.cnblogs.com/love17914