用HTML5代替PPT

如果你是前端,如果你要分享。
是不是觉得PPT很难用?
是不是觉得用PPT很不能体现你的身份价值?

本人虽然不是全职前端,但也算半个前端,
也有这样的想法,最近就自己弄了一个。

实现了如下功能:
空格翻页(展示的时候空格是最容易按,也最不容易按错、多按,虚按的。)
滚轮翻页(分享给网上朋友的时候,滚轮才是最方便的)
目录(因为我课件展示的屏幕是宽屏,太长,所以边上留有目录)
点击目录可以跳转(同样是给网上看网页的朋友准备的)
页数(展示时候用)
点开带hash的url可以直接跳转到某一页(便于分享特定页)
自适应用户分辨率
一页之内逐步显示内容
当前页在目录上高亮

Chrome下动画效果比较好,Firefox下有点卡。(其实是非常卡!)
推荐用这两个浏览器查看: 展示页面

制作的时候正巧玉伯分享了他的分享
这个是源自于 google 推广的 HTML5Rocks(需翻墙,项目地址不需要翻墙)
我也借势参考了一些想法,比如url的hash定位,以及部分CSS写法。
当然,我自认为应该比那个好看一点吧,呵呵。
(后来我想想,这个风格应该是潜意识中受到了Flex的影响吧)

《用HTML5代替PPT》有10个想法

    1. 那个是chrome的bug,缩小后就不准了,我没办法。
      chrome下不缩放时完好,firefox 4下缩放后也完好。

        1. 我现在换了一种实现方式,绕过了这个bug。并且用zoom或者transform缩放,可以自适应浏览器宽度了。

发表评论