本文实例为大家分享了js实现方块移动的具体代码,供大家参考,具体内容如下

#box{

width: 50px;

height: 50px;

position: absolute;

background: palevioletred;

}

stop

var speed = 10;

var flag = true;

var interid;

function moveleft(){

var oldleft = parseint(box.style.left);

if(oldleft >= window.innerwidth-50 || oldleft < 0){

speed *= -1;

}

box.style.left = oldleft + speed + "px";

}

function movetop(){

var oldtop = parseint(box.style.top);

if(oldtop >= window.innerheight-50 || oldtop < 0){

speed *= -1;

}

box.style.top = oldtop + speed + "px";

}

function onoff(rand){

// var rand = random();

if (flag) {

btn.innerhtml = "start";

clearinterval(interid);

flag = false;

} else{

btn.innerhtml = "stop";

if (rand == 1) {

interid = setinterval("moveleft()",50);

// flag = true;

} else{

interid = setinterval("movetop()",50);

// flag = true;

}

flag = true;

}

}

btn.onclick =onoff;

//产生一个1-2的随机数

function random(){

rand = parseint(math.random() * 2 + 1);

alert(rand);

if (rand == 1) {

interid = setinterval("moveleft()",50);

} else{

interid = setinterval("movetop()",50);

}

}

random();

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持萬仟网。

希望与广大网友互动??

点此进行留言吧!

bom实现方块移动_js实现方块上下左右移动效果相关推荐

  1. wpsword怎样涂黑方框_Excel中如何插入空心小方块和实心小方块的标志?

    点击查看Excel中如何插入空心小方块和实心小方块的标志?具体信息 答:将光标定位在插入表格中 单击[插入].[符号]按钮,将弹出的[符号]对话框,在"子集"选项中选择" ...

  2. 我的世界服务器指令标题显示,我的世界命令方块 如何用命令方块显示标题

    导读 大家好,下面是小编给大家带来的我的世界命令方块 如何用命令方块显示标题,希望能帮到大家! [本文转自我的世界官方论坛,原作者:Netro777] 有不好的地方请大家见谅...版本1.9/1.9以 ...

  3. C语言Window控制台实现弹弹方块(单个方块,多个方块)

    前面,我们用C语言实现了列表时的学生信息管理系统,那么,window控制台还能做什么好玩的东西呢? http://blog.csdn.net/morixinguan/article/details/7 ...

  4. 方块 游戏界面java_JAva 判断方块游戏清除方法

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 在一块画布上放类似俄罗斯方块的格子. 若是每一行或是每一列填满了,自动清除. 分三种情况,行满了:清除行 列满了:清除列 同时满了,同时清除: 如果分开写 ...

  5. 老方块 oracle培训,老方块Oracle 11g培训新版小学班 SQL 完整35课 星爷版 OCA OCP

    课程介绍 老方块Oracle 11g培训新版小学班 SQL 完整35课 星爷版 OCA OCP 课程目录 老方块ORACLE培训23班小学第1课 老方块ORACLE培训23班小学第2课 老方块ORAC ...

  6. 迷你世界滑动方块机器人怎么做_迷你世界滑动方块怎么用 滑动方块用法教学...

    迷你世界滑动方块是一个十分困难的合成方块,制作出来就比较难了,最揪心的就是他的使用方法,今天小编就分享下迷你世界滑动方块用法攻略,一起来看看迷你世界滑动方块怎么用吧! 滑动方块合成 合成需要: 焦油X ...

  7. 方块方舟服务器维护,方块方舟主机连接超时 | 手游网游页游攻略大全

    发布时间:2015-11-13 unturnde官方服务器我想现在很多玩家都想知道到底出了没有?没出会是在什么时候出?出了之后我们又该怎么进,对于这些问题,大家可以在本站进行搜索便知,另外,我们还是来 ...

  8. 边缘方块JAVA_方块边缘电脑版|方块边缘EDGE最新版下载v1.92.4-乐游网安卓下载

    <方块边缘EDGE最新版>是一款魔法翻转主题的立体方块游戏,玩法有点类似玩魔方,不过游戏中每一关的方块样式都不固定,并且目标只有一个彩色方块,经过翻转将它移到制定地点即可,看起来比魔方还简 ...

  9. 计算机网络技术方块队队形,高校方块队队形及口号

    技校网专门为您推荐的类似问题答案 问题1: 连云港共有哪些高校及中专??? 淮海工学院(唯一的一所本科)连云港师范高等专科学校连云港医科高等专科学校连云港职业高等专科学校江苏城市职业技术学院连云港分院 ...

  10. puzzle(1412)俄罗斯方块、方块消除、解封方块

    目录 俄罗斯方块 方块消除 彩方块消除 解封方块 俄罗斯方块 4399在线play 凑齐一行就消除. 方块消除 4399在线play 不区分颜色,只要一行.一列或者一宫9个格子都填满了,即可消除. 彩 ...

最新文章

  1. Windows忘记mysql的密码
  2. 服务器故障英文邮件,服务器一般故障排除(国外英文资料).doc
  3. java clob存储_java oracle clob string 大字符串存储
  4. Spring : Spring Aop JDK动态代理调用过程
  5. C#.NET学习笔记7--11---算术运算符,变量赋值,变量的交换,布尔表达式1,布尔表达式2
  6. Docker入门与实践之 Dockerfile 语法详解
  7. SAP Brazil J1BTAX 为税收例外创建税收组(翻译)
  8. mysql 几个超时参数(timeout)解释
  9. hdu 2119(最大匹配)
  10. R语言基础期末大作业
  11. canvas实现动态小球碰撞
  12. C++汽车4S店管理系统
  13. 车子刹车油管ABS油管被剪了好几刀,我还有救吗?
  14. 【日常吐槽 · 第七期】进击的博客
  15. 微信扫二维码下载apk跳转浏览器打开的方式(及微信屏蔽下载解决方案)
  16. Ubuntu虚拟机ping不通
  17. 为什么使用服务器端渲染 (SSR)?
  18. 难以置信!网易首席架构师竟用了500页笔记,把网络协议给趣谈了
  19. 分享四个体验不错的云游戏平台—网易云游戏、腾讯云游戏、菜鸡云游戏、格莱云游戏
  20. 【Jenkins】Jenkins容器构建脚本以及容器瘦身docker-slim使用

热门文章

  1. css文字向右对齐_如何使用CSS实现文本左对齐、右对齐和居中对齐
  2. STM32F103_study64_The punctual atoms(Simulator and downloader)
  3. Linux下安装ODI
  4. python sklearn PR曲线 AUPR值
  5. python2.0下载_【Python for S60V2】Python for S60V2 V2.0官方免费下载_正式版下载-多特软件站...
  6. 常微分方程各种类型方程表格汇总
  7. zbox mysql_系统重启后,使用./zbox start 启动时,mysql数据库启动不起来,日志文件里无任何记录...
  8. 电脑中病毒,文件夹变成快捷方式
  9. 2017-09-04考试情况总结
  10. 链家租房数据基本分析