地址:http://qs20199.github.io/paino,支持PC/触屏,CSS3动画只写了webkit的。
最近开始玩钢琴,第一道坎是看懂钢琴谱,想找一个帮助记忆五线谱和钢琴键位对应的工具,没看到合适的,就自己写了一个。
右上角的input可以自定义练习区间,例如输入 0,5 则可以指练习最上面五个音,以此类推,最大(默认)为0,19。
前端tips:
处理触摸屏的事件触发时,使用touchstart事件比一般的click事件,用户体验要好得多,反应速度能媲美原生app了。
原因是click事件需要等待300ms,想了解详情,推荐书籍《HTML5触摸界面设计与开发》。