多语言展示
当前在线:1228今日阅读:23今日分享:25

javascript写象棋程序第三季移动div开始

要让棋子动起来,要用到div拖动,这里先训练怎样拖动div,然后把拖动移植到象棋程序里面
方法/步骤
1

新建一个html文件测试拖动div

2

建立文件名字为2.html

3

引入jquery和2.css

4

html加入拖动层

5

在css文件定义拖动层样式和位置

6

在浏览器查看效果

7

javascript写拖动代码

8

写之前为了让思路更清楚,先用思维导图把写代码思路理清,方便后面开工

10

继续加代码测试一下按下,和松开,移动是否可行

11

放到浏览器看看控制台效果

12

用思维图进一步让代码写下去

13

这里增加跟随鼠标的坐标的显示代码

14

浏览器查看一下跟随鼠标效果

15

增加更改移动层位置

16

现在浏览器查看跟随鼠标移动效果发现移动过程,鼠标总是放在边角,最好把鼠标放在中间

17

移动层50,一半是25,这里代码更改一下

18

查看浏览器效果可以看出现在鼠标移动在里面了

推荐信息