资讯专栏INFORMATION COLUMN

原生js实现架子鼓特效

mcterry / 1201人阅读

摘要:如果当前的元素变化的属性名称不是,如果条件成立的话,并终止运行,如果条件不成立会运行下一行代码。

这是代码完成的效果,按下abcd会出现对应的架子鼓音乐的效果。

简单的介绍下代码思路,html和css部分就不多说了。

重要的是js部分。

大致是这样的,

首先获取到所有的按钮为一个数组,然后遍历整个数组,增加监听函数,如果按钮的其一被按下,就会播放相应的声音。

最后附上github地址 http://link.zhihu.com/?target...

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

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

相关文章

  • 原生js实现子鼓特效

    摘要:如果当前的元素变化的属性名称不是,如果条件成立的话,并终止运行,如果条件不成立会运行下一行代码。 这是代码完成的效果,按下abcd会出现对应的架子鼓音乐的效果。 简单的介绍下代码思路,html和css部分就不多说了。 重要的是js部分。 大致是这样的, showImg(https://segmentfault.com/img/bVMj8c?w=1667&h=625); 首先获取到所有的...

    tain335 评论0 收藏0
  • 2017-07-22 前端日报

    摘要:前端日报精选任何网站都可以变成但我们需要做得更好译高性能个新工具加速你的应用在生产环境中使用记录日志手把手教你用开发一个发布中文译继承实例译基于背后的合理化,而非设计掘金实现哪家强中的众成翻译快速入门个人文章一个基于区块链的深网 2017-07-22 前端日报 精选 任何网站都可以变成 PWA —— 但我们需要做得更好[译] 高性能 React:3 个新工具加速你的应用在生产环境中使用...

    endless_road 评论0 收藏0
  • 2018年,前端应该怎么学?

    摘要:未来一个大的趋势就是前端开发的效果,正无限逼近原生效果同时一些大厂也在纷纷提前布局了,之前惊艳四方的天猫造物节淘宝造物节风靡朋友圈的怎么做的如果我们要在这波浪潮上取得先机,那么就必须提前学习。我个人想学习的框架是天猫的。 面向2018年,我觉得前端有这么三个方向可以突破 前端逻辑层(包括三大框架,webpack,前端数据管理) 前端交互层(包括css3,canvas,svg,vr...

    AnthonyHan 评论0 收藏0

发表评论

0条评论

mcterry

|高级讲师

TA的文章

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