js跑步算法的实现代码

先复制一下，看看运行的效果吧，其中用到的精髓是setInterval（）方法：


代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>JavaScript</title>
<style>
html
{
background-color:silver;
}
.point1
{
position:absolute;
left:10px;
top:40px;

}
.point2
{
position:absolute;
left:100px;
top:40px;
}
.hr1
{
position:absolute;
top:60px;
}
</style>
<script type="text/JavaScript">
document.onmousedown = mousedown;
document.onmouseup = mouseup;
var intervalProcess;
var direct = true;
function mousedown(){
intervalProcess = setInterval("MovePoint()", 1);
}
function mouseup(){
clearInterval(intervalProcess);
}
function MovePoint(){
with (document.getElementById("point1").style){
if (isNaN(parseInt(left)))
left = "10px";
else {
document.getElementById("point2").style.left = "200px";
if (parseInt(left) < 0)
direct = true;
if (parseInt(left) > parseInt(document.getElementById("point2").style.left))
direct = false;
if (direct)
left = parseInt(left) + 1 + "px";
else
left = parseInt(left) - 1 + "px";
}
}
}
</script>
</head>
<body>
<div class="point1" id="point1"><font color=blue>a</font></div>
<div class="point2" id="point2"><font color=red>b</font></div>
<hr class="hr1" />
</body>
</html>

赞 (0)

相关推荐

  • 利用JS来控制键盘的上下左右键(示例代码)

    这是一个JS初级代码,想学JS的朋友,可以研究下或者扩展下,最好能用JS实现整个键盘的控制,那感觉就很有意思了. 具体代码如下: 复制代码 代码如下: <style>tr.highlight{background:#08246B;color:white;}</style><table border="1" width="70%" id="ice"><tr><td><input ty

  • js游戏人物上下左右跑步效果代码分享

    js游戏人物上下左右跑步效果代码分享

    本文实例讲述了js游戏人物上下左右跑步效果.分享给大家供大家参考.具体如下: js游戏人物上下左右跑步效果是一款jquery ui制作的点击按钮网格布局头像图片动画切换特效.你操控着游戏人物,掌控一切是不是很有意思,感兴趣的小伙伴们可以学习一下 运行效果图:-------------------查看效果 下载源码------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的jQuery实现热气球动画背景登录框代码如下 <!DOCTYPE html>

  • js键盘上下左右键怎么触发function(实例讲解)

    复制代码 代码如下: <script type="text/javascript"> function jumpPage() {     if (event.keyCode==37)//左 fun_a(); if (event.keyCode==38)//上 fun_b(); if (event.keyCode==39)//右 fun_c(); if (event.keyCode==40)//下 fun_d(); } function fun_a(){ window.ale

  • js 上下左右键控制焦点(示例代码)

    如下所示: 复制代码 代码如下: //begin---------------上下左右键控制 if('${iscontrol_mchntid}'.indexOf('${mchntid}')!=-1){ var texts = new Array();//设置为focus所在的locationvar x = 2;var y = 3;var maxx = 0;var maxy = 0;window.onload=function(){var inputs = $("[location]")

  • JS实现用键盘控制DIV上下左右+放大缩小与变色

    用键盘控制DIV,红色方块为键盘操作区域,您可以进行如下操作: 上:↑ 下:↓ 左:← 右:→ Ctrl + 1 : 背景变为绿色 Ctrl + 2 : 背景变为黄色 Ctrl + 3 : 背景变为蓝色 Ctrl + ↑ : 放大 Ctrl + ↓ : 缩小 用键盘控制DIV html,body{overflow:hidden;} body{margin:0;padding:0;} pre{color:green;padding:10px 15px;background:#f0f0f0;bord

  • js实现键盘上下左右键选择文字并显示在文本框的方法

    本文实例讲述了js实现键盘上下左右键选择文字并显示在文本框的方法.分享给大家供大家参考.具体实现方法如下: <!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&quo

  • js跑步算法的实现代码

    先复制一下,看看运行的效果吧,其中用到的精髓是setInterval()方法: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>JavaScript</title><style>html{backgroun

  • js LZ77算法的实现代码

    所以钻研了一段时间的gzip,后来发现还是仅用LZ77 比较容易实现,gzip中的 haffman 压缩部分对于JS来说太难搞了. 代码如下,注释的非常完整,所以就不多说了,有兴趣的可以仔细研究下: LZ77 * { font-size:12px; } body { overflow:auto; background-color:buttonface; } textarea { width:100%; height:240px; overflow:auto; } #btn1 { width:10

  • php 二维数组快速排序算法的实现代码

    php 二维数组快速排序算法的实现代码 二维数组排序算法与一维数组排序算法基本理论都是一样,都是通过比较把小的值放在左变的数组里,大的值放在右边的数组里在分别递归. 实例代码: <?php class Bubble { private function __construct() { } private static function sortt($data) { if (count ( $data ) <= 1) { return $data; } $tem = $data [0]['sco

  • vue2.0中goods选购栏滚动算法的实现代码

    不多说,直接代码,以便以后重复利用: <script type="text/ecmascript-6"> import BScroll from 'better-scroll'; const ERR_OK = 0; export default { props: { sell: { type: Object } }, data() { return { goods: [], listHeight: [], scrollY: 0 }; }, computed: { curre

  • python常用排序算法的实现代码

    这篇文章主要介绍了python常用排序算法的实现代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 排序是计算机语言需要实现的基本算法之一,有序的数据结构会带来效率上的极大提升. 1.插入排序 插入排序默认当前被插入的序列是有序的,新元素插入到应该插入的位置,使得新序列仍然有序. def insertion_sort(old_list): n=len(old_list) k=0 for i in range(1,n): temp=old_lis

  • php计数排序算法的实现代码(附四个实例代码)

    计数排序只适合使用在键的变化不大于元素总数的情况下.它通常用作另一种排序算法(基数排序)的子程序,这样可以有效地处理更大的键. 总之,计数排序是一种稳定的线性时间排序算法.计数排序使用一个额外的数组C ,其中第i个元素是待排序数组 A中值等于 i的元素的个数.然后根据数组C 来将A中的元素排到正确的位置. 通常计数排序算法的实现步骤思路是: 1.找出待排序的数组中最大和最小的元素: 2.统计数组中每个值为i的元素出现的次数,存入数组C的第i项: 3.对所有的计数累加(从C中的第一个元素开始,每一

  • 使用Python处理KNN分类算法的实现代码

    使用Python处理KNN分类算法的实现代码

    目录 KNN分类算法的介绍 测试数据 Python代码实现 结果分析 简介: 我们在这世上,选择什么就成为什么,人生的丰富多彩,得靠自己成就.你此刻的付出,决定了你未来成为什么样的人,当你改变不了世界,你还可以改变自己. KNN分类算法的介绍 KNN分类算法(K-Nearest-Neighbors Classification),又叫K近邻算法,是一个概念极其简单,而分类效果又很优秀的分类算法. 他的核心思想就是,要确定测试样本属于哪一类,就寻找所有训练样本中与该测试样本“距离”最近的前K个样本

  • C/C++ MD5算法的实现代码

    在逆向程序的时候,经常会碰到加密的算法的问题,前面分析UC的逆向工程师的面试题2的时候,发现使用了MD5的加密算法(MD5算法是自己实现的,不是使用的算法库函数).尤其是在逆向分析网络协议的时候,一般的程序使用的加密算法都是使用的库函数提供的算法,有些程序使用的算法是自己实现的:相对来说使用函数库提供的加密函数的算法相对来说比较好识别,因为有算法常见函数在:但是如果不是使用的函数库提供的加密的函数而是自己去实现某些算法话,识别起来有一定的难度,这就需要你对函数的加密原理以及流程还算法的特征比较熟

  • Spectral clustering谱聚类算法的实现代码

    Spectral clustering谱聚类算法的实现代码

    目录 1.作者介绍 2.关于谱聚类的介绍 2.1 谱聚类概述 2.2 无向权重图 2.3 邻接矩阵 2.4 相似矩阵 2.5 度矩阵 2.6 拉普拉斯矩阵 2.7 K-Means 3.Spectral clustering(谱聚类)算法实现 3.1 数据集 3.2 导入所需要的包 3.3 获取特征值和特征向量 3.4 利用K-Means聚类 3.5 完整代码 4.参考 1.作者介绍 刘然,女,西安工程大学电子信息学院,2021级研究生研究方向:图像处理电子邮件:1654790996@qq.com

  • JS中多层次排序算法的实现代码

    JS中多层次排序算法的实现代码

    引子 排序在编程中随处可见,从开始学习变成,到项目开发,基本上或多或少会遇到一些排序问题,接下来我要写的是我在实际开发终于到的一个排序问题,一开始卡了我很久,后面随着知识积累,实践变多才解决掉了,不知道是不是我搜索关键字不对,还是其他原因,百度也没有找到这方面的内容. 数据结构和需求 var arr = [ { "soNumber" : "52085848", "item" : "313281", "amount&q

随机推荐