打印

象棋盘！

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

1^# 大中小发表于 2006-8-25 13:52

http://www.haao.cn/cool/xiangqipan.htm

感谢marvellous提供的棋子！
加入棋子只是为了更像一点，棋子不能移动！提供的棋子！
无棋子：http://www.haao.cn/cool/xiangqipan.htm
有棋子：http://www.haao.cn/cool/xiangqipan2.htm

加入棋子只是为了更像一点，棋子不能移动！

数学题有一题多解，因此解决问题的思路和方法可能不止一种！
在此只做为抛砖引玉，希望能有更好的！

http://www.haao.cn/article.asp?id=241

IE6.0 OK
FF 中会变形

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>象棋盘</title>
<style type="text/css">

</style>
</head>
<body>
<div id="all">
  <div id="big">
  
  
    <div class="k"></div>
    <div class="k"></div>
    <div class="k"></div>
    <div class="k"><div class="xrline"><script>var str='';for(var i=1;i<=79;i++)document.write(new Array(i).join("\&nbsp;")+".<br\/>")</script></div></div>
    <div class="k"><div class="xrline2"><script>var str='';for(var i=1;i<=80;i++)document.write("."+new Array(i).join("\&nbsp;")+"<br\/>")</script></div></div>
    <div class="k"></div>
    <div class="k"></div>
    <div class="k"></div>
	
	
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"></div>
    <div class="k"><div class="xrline2"><script>var str='';for(var i=1;i<=80;i++)document.write("."+new Array(i).join("\&nbsp;")+"<br\/>")</script></div></div>
    <div class="k"><div class="xrline"><script>var str='';for(var i=1;i<=79;i++)document.write(new Array(i).join("\&nbsp;")+".<br\/>")</script></div></div>
    <div class="k"></div>
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
	
	
    <div class="k"><div class="s4">s4</div><div class="s5">s5</div></div>
    <div class="k"><div class="s2">s2</div><div class="s6">s6</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s4">s4</div><div class="s5">s5</div></div>
    <div class="k"><div class="s2">s2</div><div class="s6">s6</div></div>
    
	<div class="k"><div class="s2">s2</div></div>
	<div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div></div>
    <div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div></div>
    <div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div></div>
    <div class="k"><div class="s4">s4</div></div>
	
	<div id="m"><div id="m1">&nbsp;&nbsp;楚 河</div><div id="m2">&nbsp;&nbsp;汉 界</div></div>
	
	<div class="k"><div class="s3">s3</div></div>
	<div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"><div class="s1">s1</div></div>
    <div class="k"><div class="s3">s3</div></div>
    <div class="k"><div class="s1">s1</div></div>
	
	<div class="k"><div class="s2">s2</div><div class="s6">s6</div></div>
	<div class="k"><div class="s4">s4</div><div class="s5">s5</div></div>
    <div class="k"><div class="s2">s2</div></div>
    <div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div></div>
    <div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div><div class="s6">s6</div></div>
    <div class="k"><div class="s4">s4</div><div class="s5">s5</div></div>
	
    <div class="k"><div class="s4">s4</div>
    </div>
    <div class="k"><div class="s2">s2</div>
    </div>
    <div class="k"></div>
	<div class="k"><div class="xrline"><script>var str='';for(var i=1;i<=79;i++)document.write(new Array(i).join("\&nbsp;")+".<br\/>")</script></div></div>
    <div class="k"><div class="xrline2"><script>var str='';for(var i=1;i<=80;i++)document.write("."+new Array(i).join("\&nbsp;")+"<br\/>")</script></div></div>
    <div class="k"></div>
    <div class="k"><div class="s4">s4</div></div>
    <div class="k"><div class="s2">s2</div></div>
	
	
	<div class="k"></div>
    <div class="k"></div>
    <div class="k"></div>
    <div class="k"><div class="xrline2"><script>var str='';for(var i=1;i<=80;i++)document.write("."+new Array(i).join("\&nbsp;")+"<br\/>")</script></div></div>
    <div class="k"><div class="xrline"><script>var str='';for(var i=1;i<=79;i++)document.write(new Array(i).join("\&nbsp;")+".<br\/>")</script></div></div>
    <div class="k"></div>
    <div class="k"></div>
    <div class="k"></div></div>
</div>
</body>
</html>

提示：您可以先修改部分代码再运行

每一个方格都用的DIV，左边和下边有1PX边框，全部的小框都包含在一个上边和右边为1PX的大边框中！
为了防止出现过2px较粗的边线！

引用:

background:#FFF;
float:left;
width:80px;
height:80px;
border-bottom:#000 solid 1px;
border-left:#000 solid 1px;

士帅的位置的斜线，本想用border来实现，但只能用颜色区分开斜角

提示：您可以先修改部分代码再运行

只能用颜色区分开，显示不出对角线！在BI上搜了搜，换取了下面这个方法

提示：您可以先修改部分代码再运行

楚河汉界
字体用的“华文行楷”，在前面加个“@”，文字就能逆时针旋转90度！

至于“汉界”，filter: FlipH;，水平翻转对象内容。

提示：您可以先修改部分代码再运行

忘记了红黑棋子之分！士与仕，将与帅，相与象，炮，俥，马

[ 本帖最后由 newlethe 于 2006-8-25 16:55 编辑 ]

本帖最近评分记录

marvellous 威望 +2 原创内容 2006-8-25 14:20

http://www.haao.cn

TOP

做西部数码代理.Cn1元国际45元 | 微软开发者工具互动网站

marvellous

金翅擘海

荣誉管理团队

帖子: 11819
体力: 26926
威望: 140
当前: 北京朝阳区

2^# 大中小发表于 2006-8-25 14:24

给楼主加分鼓励一下原创

给楼主加分鼓励一下原创。
若把我给的下面例子中的棋子加进去摆成一个象棋的初始局面可能会更有意思！

提示：您可以先修改部分代码再运行

[ 本帖最后由 marvellous 于 2006-8-25 15:07 编辑 ]

┏┯┓┏┯┓┏┯┓┏┯┓
┠知┨┠往┨┠观┨┠来┨
┗┷┛┗┷┛┗┷┛┗┷┛

TOP

美橙vps独立IP月付189元 | 千千静听皮肤设计大赛

bound0

老饕

版主

帖子: 3480
体力: 8561
威望: 273
当前: 北京海淀区
离线: 1 天

专长 JS,Perl,产品设计

3^# 大中小发表于 2006-8-25 14:36

桃花岛主（前辈）的象棋局可供参考，棋盘部分是用VML画的

原帖http://bbs.blueidea.com/viewthread.php?tid=1723499

原帖中演示链接已失效。附件是我收藏的副本。

附件: 您所在的用户组无法下载或查看附件，您需要注册/登录后才能查看！

[Bound0 专题列表]QUE SAIS-JE?
生物信息技术支持动漫论坛动漫分享群：45274013

TOP

掌握加薪筹码 IT薪资宝典给您答案！ | 《疯狂的程序员》劲爆上市

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

4^# 大中小发表于 2006-8-25 14:58

[quote]原帖由 marvellous 于 2006-8-25 14:24 发表
给楼主加分鼓励一下原创。
若把我给的下面例子中的棋子加进去摆成一个象棋的初始局面可能会更有意思！

谢谢！

我再试试加进棋子！

http://www.haao.cn

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

5^# 大中小发表于 2006-8-25 15:00

引用:

原帖由 bound0 于 2006-8-25 14:36 发表
桃花岛主（前辈）的象棋局可供参考，棋盘部分是用VML画的

原帖http://bbs.blueidea.com/viewthread.php?tid=1723499

原帖中演示链接已失效。附件是我收藏的副本。

真厉害！！

不得不佩服

http://www.haao.cn

TOP

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

6^# 大中小发表于 2006-8-25 16:43

有棋子：http://www.haao.cn/cool/xiangqipan2.htm

http://www.haao.cn

TOP

mooon

银牌会员

帖子: 456
体力: 1396
威望: 0
离线: 8 天

专长 .NET,C#

7^# 大中小发表于 2006-8-25 16:53

高人啊

我如清泉-----清澈见底一览无余
吾乃大海-----汹涌澎湃狂热不已

TOP

mooon

银牌会员

帖子: 456
体力: 1396
威望: 0
离线: 8 天

专长 .NET,C#

8^# 大中小发表于 2006-8-25 16:55

谁来补个算法，可以做个Web版的象棋对战了

我如清泉-----清澈见底一览无余
吾乃大海-----汹涌澎湃狂热不已

TOP

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

9^# 大中小发表于 2006-8-25 16:57

桃花岛主的那个版本可以对战

http://www.haao.cn

TOP

marvellous

金翅擘海

荣誉管理团队

帖子: 11819
体力: 26926
威望: 140
当前: 北京朝阳区

10^# 大中小发表于 2006-8-25 21:54

引用:

原帖由 newlethe 于 2006-8-25 16:43 发表
有棋子：http://www.haao.cn/cool/xiangqipan2.htm

两边棋子都用了红字黄底.
应该改成一个红方,一个黑(绿)方。

┏┯┓┏┯┓┏┯┓┏┯┓
┠知┨┠往┨┠观┨┠来┨
┗┷┛┗┷┛┗┷┛┗┷┛

TOP

newlethe [楼主]

高级会员

帖子: 356
体力: 774
威望: 2
当前: 湖北武汉
离线: 17 天

11^# 大中小发表于 2006-8-26 13:11

引用:

原帖由 marvellous 于 2006-8-25 21:54 发表

两边棋子都用了红字黄底.
应该改成一个红方,一个黑(绿)方。

一时疏忽,忘记了区分棋子的颜色!

http://www.haao.cn

TOP

桃花岛主

银牌会员

帖子: 742
体力: 2909
威望: 0
离线: 53 天

12^# 大中小发表于 2006-8-26 14:36

挖，又有人做象棋了哇？支持支持，呵呵，多年以后反思当初写的象棋代码，那时候写得一时手快，很多东西没考虑，况且只是玩玩，后来也没有写完，结构在现在看来不太好。当时水平有限啊，我想有个时间来重写一遍了，加班太多，哎～

情愿用一生时间守护一个诺言，不需要海誓山盟，只要你懂，我懂。

TOP