资讯专栏INFORMATION COLUMN

【题目】【4天2】会移动的汽车

Raaabbit / 384人阅读

摘要:题目用原型的方法,绘制会动的汽车,要求可以一下制作一组汽车让汽车向右移动移动的距离可以手动控制分析用构造函数方方创建一组车辆的坐标绘制汽车向右移动可手动更改移动距离用构造函数创建一组坐标用原型方法向内部添加属性方法,绘制汽车向右移动,可手动

题目:用原型的方法,绘制会动的汽车,要求1.可以一下制作一组汽车;2.让汽车向右移动;3.移动的距离可以手动控制

分析:

用构造函数方方创建一组车辆的坐标

绘制汽车

向右移动(可手动更改移动距离)

//用构造函数创建一组坐标
var Car = function (x, y) {
    this.x = x;
    this.y = y;
};

//用原型方法向Car内部添加属性(方法),绘制汽车
Car.prototype.draw = function () {
    var carHtml = "";
    this.carElement = $(carHtml);

    this.carElement.css({
        position : "absolute",
        left : this.x,
        top : this.y
    });
    $("body").append(this.carElement);
};

//向右移动,可手动修改参数
Car.prototype.moveRight = function (distance) {
    this.x += distance;
    
    this.carElement.css({
        left : this.x,
        top : this.y
    })
};

//调用Car,可随时新建n辆汽车,且独立
var tesla = new Car(20.20);
tesla.draw();

//setinterval()方法,周期性的调用函数
setInterval(function () {tesla.moveRight(10)},10);

注意:如果用这种方法调用setInterval(tesla.moveRight(10),10)setInterval()会调用windowsmoveRight,而不是teslamoveRight,看到的效果是:只在页面加载时,运行了一次,就没有后文了。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107695.html

相关文章

  • 题目】【8】canvas画板

    摘要:和监听用户是否在绘画。再绘画不在绘画。监测用户是在使用橡皮檫,是在使用橡皮擦,停止使用铅笔。使用,会变为使用,后面会增加一个属性值。的作用是获取宽度也就是宽度移动端支持多点触控,所以要获取需要加上,表示第一个值 canvas画板,比较简易,目前还有很多bug1、手机端上下会晃动2、下载按钮微信上没法用3、下载后背景色是透明4、切换成橡皮擦后,需要先点铅笔才能绘画,不能直接点颜色 ...

    Xufc 评论0 收藏0
  • 2018新“风口”——直播答题应用原理解析

    摘要:在年初,直播答题呼啸而来,成为互联网行业的第一个风口。据艾媒数据显示,直播答题热度指数在月日达到峰值。尤其是直播答题类应用,一边撒着币,一边烧着带宽。秒,开始对此,马化腾的答案是,周鸿祎的答案是。目前看来,周鸿祎答对了。 在 2018 年初,直播答题呼啸而来,成为互联网行业的第一个风口。这种在直播平台上快速答题,平分巨额奖金的活动,让很多人感受到了用知识赚钱的乐趣。仅半月不到,映客直播...

    Half 评论0 收藏0
  • Hot-Standby技术助力微车AI黑科技:老司机是如何养成

    摘要:故障识别产品是微车最新的产品,也是微车智能转型的重要一步。宋体但同时,微车还提出了其他的业务痛点诉求。宋体最终,微车选择使用算力资源优先保障用户的使用体验,同时高成本投入的难题也得到了解决。首先来问在座的老司机一个问题:你能快速说出下面这张图中每一个指示灯、告警标志的准确释义吗? 在生活中,我们经常会遇到汽车仪表盘故障标志亮起的情况,但很多人对此却是茫然无措。面对突发的小状况,...

    Zhuxy 评论0 收藏0
  • 王者编程大赛之一

    摘要:首发于樊浩柏科学院本次王者编程大赛分为个组别,分别为研发测试移动战场。本章只叙述前道相对简单的题目,后续题目及解题思路将在王者编程大赛系列中列出。 首发于 樊浩柏科学院 本次王者编程大赛分为 3 个组别,分别为研发、测试、移动战场。这里只讨论研发战场所考的 题目,本次大赛共有 7 道题,主要考查点为基础算法,解题所用语言不做限制,但是需要在 在线验证平台 使用标准输入并验证通过,最后...

    justCoding 评论0 收藏0
  • 智能科学与技术 毕业设计怎么做 - 选题推荐 - 疑问解答

    摘要:选题推荐持续性更新中以下为学长精选整理的智能科相关的毕设选题,供大家参考。最后毕设帮助毕设帮助,开题指导,技术解答 文章目录 1 前言2 选题注意事项2.1 选择...

    scq000 评论0 收藏0

发表评论

0条评论

Raaabbit

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<