繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JQuery 国际象棋棋盘 实现代码
- Javascript
- 图片展示效果 鼠标经过变大图，支持FF
- 可拖动可改变大小div的实现代码
- javascript 随机广告代码(图片广告)
- JS+Ajax+Jquery实现页面无刷新分页以及分组 超强的实现
- JQuery 浮动导航栏实现代码
- jQuery一步一步实现跨浏览器的可编辑表格，支持IE、Firefox、Safari、Chrome、Opera
- js 分栏效果实现代码
- 基于jQuery的ajax功能实现web service的json转化
- IE 条件注释详解总结（附实例代码）
- 用cssText批量修改样式
- JavaScript 应用技巧集合[推荐]
- jquery 导航设计实现代码 学习jquery的朋友可以看下
- 动态样式类封装JS代码
- 一步一步教你写一个jQuery的插件教程(Plugin)
- 使用jQuery的ajax功能实现的RSS Reader 代码
- jquery tools 系列 scrollable（2）
- jquery tools系列 overlay 学习
- jquery tools系列 expose 学习
- javascript十个最常用的自定义函数(中文版)
- javascript 流畅动画实现原理
Javascript 中的 JQuery 国际象棋棋盘 实现代码
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 294 ::
收藏到网摘: n/a
前些时候为了熟悉国际象棋的各种开局，随手写了一个很简单的国际象棋棋盘（实在找不到现成的）。 当时没觉得有什么，今天回头看看，觉得还有点意思，拿来给大家鉴定一下。
首先要实现棋子的排布，这毫无疑问得用div+css了。
具体代码可以看Jquery做的国际象棋棋盘（查看源代码） 。
一开始我给每种棋子都写了类，实际上这是比较愚蠢的行为。首先，这样子css代码会有冗余。其次，在棋子div上绑定侦听器时会比较麻烦，要判断是否棋子div时，我不得不靠类名中的-b和-w后缀来判断是否棋子。但是如果我们将棋子的共同属性提取出来专设一个类qizi，那么这两个问题都可以迎刃而解。
在代码中我特意没有将之前的代码去掉，你可以在注释的代码中看到。为了让黑棋和白旗都可以移动，我不得不把一个方法写上两边，你看，这就是没有进行足够的抽象化的后果。
接下来就是实现拖动了，关于这个，大家可以参考
打包下载地址
内容来自：http://buhutuu.cn/?p=783
评论 (0) All
