模拟科目二侧方位停车训练

这是利用代码来模拟驾照考试中的科目二考试的侧方位停车,通过这个可以进行科目二模拟训练。这是是通过按键盘的上下左右的进行汽车的移动的,按W或者S进行汽车的旋转。
效果图:
在这里插入图片描述
xHTML中的div1对应的就是红色的小汽车,其他的div就是一些黄色的停车线,以及一些样
式,div中的Style是我给这些线设置的一些简单的样式,不过主要的样式还是在CSS部分中,也是为了能更好的单独设置其中的某个标签的样式。

HTML部分:
在这里插入图片描述
下面就是CSS的部分,基本上都是给div设置一些宽、高,以及背景颜色还是位置等等的各种的样式,以及为了不让汽车的移动而影响到其他标签的样式,所以在这里为用了position: fixed这个方法,设置它的固定定位,还有要注意一下的就是@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部分:
在这里插入图片描述

原文链接:https://blog.csdn.net/weixin_44542115/article/details/89075908?ops_request_misc=&request_id=49dd39ea92ea474b8a384b4072ffdabc&biz_id=&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~koosearch~default-21-89075908-null-null.268%5Ev1%5Econtrol&utm_term=%E7%A7%91%E7%9B%AE%E4%BA%8C

兔子先生 西安驾培

于灯火阑珊处,于暗香离别时,未曾放弃

相关推荐

抖音矩阵平台有哪些?

  抖音矩阵平台是指一系列用于在抖音平台上进行内容创作、运营和推广的工具和系统。其中,视界引擎短视频运营获客系统作为一款全面的抖音矩阵平台,具有许多优势。 抖音矩阵平台是当今数字营销领域的热门工 ...

怎么看待直播带货的营销形式?

随着电商行业的崛起,越来越多的商家开始使用直播的方式来进行产品推广,那么直播为什么可以推广产品带货呢?直播带货的本质是什么呢?今天,就来跟大家讲解一下。直播之所以可以推广产品,引导观众购买产品是因 ...

快抖矩阵多账号管理系统官方正版

账号源从哪里来?没有那么多抖音账号?怎么赚钱?有什么价值?       首先这是一套多开可招代理的矩阵账号管理系统,第一目的是让你拿来给有很多账号的品牌机构或达人当账号辅助管理工具打理账户 ...