web 前端 转盘界面
2024-09-03 00:52:03
http://www.cnblogs.com/arfeizhang/p/turntable.html
"如果有个做转盘的需求，你准备怎么做？设计师只会提供一个转盘的图片，其余都需要你完成，不能用框架和类库。"
"这个转盘没有惯性的需求，只要求在手机上，用手指拖转盘，能让转盘跟随手指转起来即可。"
这是我在面试前端开发人员时，经常会问到的一道题。转盘是类似上图的样子。
博主之前在M公司和C公司的时候，经常用这题面试移动前端开发工程师。M公司的产品和设计是美国团队，在个别项目上UI设计比较大胆脱俗，对前端开发人员有较高的要求。C公司的只会JS的前端开发人员占比较大，产品经理有时提出的让人眼亮的需求，但从前端开发口中得到的答复往往是：“这个我们实现不了。”，产品经理只能作罢。
于是我设计了这道题，希望能找到一些知识较全面，会综合应用的前端开发人员。在平时面试过程中，因为时间的关系，也不要求应聘人员将它用代码写出来，只和我聊下思路即可。在聊的过程中，我会就相关的一些技术细节深入问一下。
通过这道题，可以探知应聘人员在移动端的开发经验，以及前端知识综合应用能力。
这道题的需求很简单，但需要开发人员掌握较全面的前端知识。我们来看下这道题涉及到哪些知识点：
CSS：
- 背景图URL，位置和大小的写法（素材图片的尺寸可能不合适）;
- 容器圆角属性；
- 旋转的实现；
- 硬件加速是什么，什么条件下会开启硬件加速；
- retina屏幕上为什么显示会模糊，如何避免？
JS:
- 触摸事件；
- 触摸事件和鼠标事件的不同处有哪些；
- 触摸坐标获取；
- 如果要两指一起拖动，圆盘才能旋转，代码需要做什么改变？
- 为什么在移动设备最好用touch事件，而不用mouse事件？
- 原生JS如何取DOM的内嵌CSS属性，如何获取外部样式表文件定义的属性?
Html:
- viewport 的参数和作用
数学:
- 角度和弧度的换算
- 向量计算
- 三角函数
面试题大多如此，需求看起来简单，但涉及到的知识却不简单。大家如果有兴趣的话，可以拿这道题练下手（大家可以先只用考虑webkit内核）。我觉得，对于常规前端开发人员，会有较大提升吧。
PS.我做了一个，现在先不发布出来，过两天放出来大家参考一下。 :P
最新文章
- 【centos7】添加开机启动服务/脚本
- How to using T-SQL statement copy table[SQL]
- php快递单号查询源码
- java中计时器的用法Timer和TimerTask的用法__java中利用Timer与TImerTask 计时器间隔执行任务
- Mahout快速入门教程
- 数据库基础（变量、运算符、if语句、while语句）
- 你能相信吗？这些都是由一个DIV元素实现的动画，纯CSS3技术
- vultr vps官网改版免费注册教程（最新优惠码）
- P3414 SAC#1 - 组合数
- HDU 5438 拓扑排序+DFS
- 1724: [Usaco2006 Nov]Fence Repair 切割木板
- Java之泛型编程
- Photoshop快速给美女人像换头发
- HDU 1969 精度二分
- Eclipse常用快捷键之代码编辑篇
- Windows Server 2012 AD域管理创建
- Redis实战配置(三)
- Caffe cpu版本 Linux配置命令及搭建
- java中的Lamdba表达式和Stream
- 微服务架构（Microservice Architect Pattern）综述——什么是微服务架构（读书笔记）