微信号:WEB_wysj

介绍:平台每天更新最实用,最新颖的网页设计、网站制作技巧精品文章,分享html+css、JavaScript、jQuery,ps等直播课录像,国内知名设计师亲授!无论你身在何处,和大家一起来利用零碎的时间学习知识,涨见识、涨工资吧!

HTML5 Google电吉他 可用键盘弹奏

2019-01-07 19:00 码农网 – 小峰

点击上方[网页设计自学平台]右上角[...][设为星标⭐]

这是一款来自Doodle的创意作品,它是一个基于HTML5 Canvas的电吉他,当我们将鼠标滑过吉他的弦时,电吉他将会发出美妙的声音,更加酷的是,你可以利用键盘来弹奏一首悦耳的乐章,非常强大的HTML5

HTML代码

<DIV id=hplogoborder="0">

<DIV id=hplogo-g>

<DIV id=hplogo-clickonclick=google.doodle.go();></DIV>

<DIV id=hplogo-lcd-screen></DIV>

<DIV id=hplogo-lcd-icon></DIV><INPUTid=hplogo-lcd-text

onclick=this.focus();this.select()readOnlyautocomplete="off">

<DIV id=hplogo-on></DIV>

<DIV id=hplogo-led></DIV>

<DIV id=hplogot>电吉他之父莱斯·保罗 96 周年诞辰</DIV></DIV>

<DIV

style="LEFT: -100px; OVERFLOW: hidden; WIDTH: 0px;POSITION: absolute; TOP: -100px; HEIGHT: 0px"><INPUT

id=hplogo-i></DIV></DIV>


原文链接(源码下载和效果演示):

http://www.codeceo.com/article/html5-google-guitar.html
作者:码农网 – 小峰

 
网页设计自学平台 更多文章 DG又出新广告,被国外网友骂惨了! 不好好修图,专门拆穿网红的P图套路! 农夫山泉2019金猪瓶,太萌了! 跨年晚会连环翻车,这些设计界的车祸事故也不能错过…… (转载)我经历的IT公司面试及离职感受
猜您喜欢 Python入门后再看点什么好? 实验楼2016年度最佳项目盘点——Python篇 惠普大数据 从Apple Watch可以看到初代iPhone的影子 java初学者,如何学习java?