模拟科目二倒车入库训练

这是利用代码来模拟驾照考试中的科目二考试的倒车入库，通过这个可以进行科目二模拟训练。这是是通过按键盘的上下左右的进行汽车的移动的，按W或者S进行汽车的旋转。

效果图：

HTML中的div1对应的就是红色的小汽车，里面的span标签则是其中的两条的白线，两条白线对应则是科目二中的固定停车位，在模拟的过程中要注意白线的位置。

其他的div就是一些黄色的停车线，以及一些文件，div中的Style是我给这些线设置的一些简单的样式，不过主要的样式还是在CSS部分中。

HTML部分：

下面就是CSS的部分，基本上都是给div设置一些宽、高，以及背景颜色还是位置等等的各种的样式，要注意一下的就是@keyframes
animation的部分，以及A、B两个的CSS部分，虽然A、B两个类基本上差不多一样但是为了JS部分能更好的切换就多写了一点。

CSS部分：

再接下来就是JQuery的部分，在写JQuery代码之前要引入JQuery的脚本文件。然后就是就是键盘按下事件，上下左右的键码值分别对应的是38、40、37、39，W对应的是87、S对应的83。通过AddClass给div1添加A或者B的类，达到小汽车旋转的效果，RemoveClass移除添加添加的类，这样就可以实现多次点击而不会影响运行的效果。

JQuery部分：

模拟科目二倒车入库训练相关推荐

科目二倒车入库流程记录 LTS
科目二倒车入库流程记录 LTS 好文章 https://blog.csdn.net/sinat_35907936/article/details/107874815 实景图过渡偶数车道比 ...
科目二倒车入库不论怎么都能入进去的方法
无奈10次死在倒车入库上,最终终于炼成了一招不论怎么脖子怎么妞,个字怎么低,座位怎么矮都能倒进去的方法,科二这次总算一次过去了,一吐为快: 先是右入库: 先按教练交的走直走正,左侧留1.2-1.5米的 ...
oracle 倒库详细步骤,科目二倒车入库步骤详解，考前必看！
倒车入库被学员们称为"科目二的老大难",其实,掌握了技巧,倒车入库并没有那么难.倒车入库中,控制车速和看准点位至关重要,做好这两点,基本就能拿下了. 看准点位第一步:上线上线的 ...
驾考科目二倒车入库技巧图解
倒车入库考试车辆运行路线图: 倒车入库操作要求: 考试过程中,车辆进退途中不得停车.从道路一端控制线(车身压控制线)倒入车库停车,再前进出库向另一端驶过控制线后倒入车库停车,最后前进驶出车库. 倒车入 ...
oracle 倒库详细步骤,科二倒车入库操作步骤高清图解，一步一解读，非常实用！...
2018-05-10 14:40:18 怎样才能彻底攻克科二最难项目?元贝驾考小编为学员整理了倒车入库最强干货,一定要仔细学哦! 倒车入库在历年来科二考试中的挂科率一直居高不下.尤其在连年驾考新政不断 ...
科目二电子路训练笔记
1.倒桩: 每个车一个感觉,慢慢磨合吧. #以下每个点,都因人身高/坐姿/坐位的不同而有所不同, #教练现有的教法风险较大,需要练习中,找到相对的动态点或方法. 总要点:速度要慢,方向打的要快. 2. ...
java科目二踩线原理,右倒车入库总踩线？是因为没有看到这些“秘诀”
右倒车入库总踩线?是因为没有看到这些"秘诀" 说到科目二倒车入库这个项目,相信会成为很多学员的噩梦,其实它的要求确实非常的多,可以说个个都精确到了一个点,一旦没有把握好这些点,就无 ...
asp:dropdownlist如何去掉三角箭头_科目二倒库打轮早会压库角，教练9图详解如何快速调车避免压线？...
大家都知道,科目二考试五项中,最难的项目就是倒车入库.史教练在给科二学员指导时,总是强调,练车时不要只记死点. 科目二考试过程瞬息万变,学员在倒库过程中,因为脚下离合没控制好,速度快了,或者是手慢了, ...
计算机ms高级应用科目一科目二考什么,什么是科目一、科目二、科目三、科目四？规则全部都在这！...
2018-06-29 14:37:17 学车是件很激动的事情,也是一件很难忘的事,当你去驾校报完名之后,有必要了解下科目一.科目二.科目三.科目四到底考什么?提前做好准备针对复习才能快速拿证. 科目一 ...

模拟科目二倒车入库训练

模拟科目二倒车入库训练相关推荐

最新文章

热门文章