［极客范］用S5做幻灯

2013-11-30 黄炎雷 IT百问

－－－－1024－－－－

为了方便大家查看文章，新做了一个全文目录。

使用方法：

回复：h    就能查看所有文章

－－－－1024－－－－

本文是一篇引导性的文章，所以不会采用大篇幅来介绍代码，S5的官方页面有很详细的编辑要点，我就不在这儿做无用功了。但如果是后期有深入研究，发现问题，我欢迎大家留言给我～～

互联网上有很多免费的服务可以用，GAE、BAE、SAE这样免费的云服务很多人都能像顺口溜一样说出来，但真正能用的转的就不多了，上次谈到“高桥”，那次的培训还有一个有意思的地方是，幻灯片没有用传统的软件制作，而是采用了网页编辑，浏览器播放的形式！！！

想必很多人都想过利用HTML制作幻灯，但真的去做的时候就又无能为力了，其实这里面的学问大着呢，但作为“产品向”的同学，我们也没有必要对这些技术的实现细节深究到底，能活用才是我们的目标。

首先介绍下S5，这是一个free（免费＋自由）的网页幻灯片模版，你可以直接在S5的官方站点（下有链接）下载到S5的各个版本的模版，用S5制作个人简介的网页幻灯片能最大限度的提升各位的BQ（逼格）值，再配合免费的云服务，上载你的代码，能通过浏览器直接播放你的幻灯片，是不是够极客，哈哈！！！

我在这里采用的是SAE+S5的解决方案，新浪的SAE在我多次实践后，它的稳定性以及易操作性都是最强的（这绝对不是广告），SAE本身的用户注册很简单，你只要拥有微博账号就可以一步注册完，接下来也会有专门的步骤引导你进入应用创建的流程，你可以选择web或移动应用，如果是用S5做个人幻灯片，直接选择web即可，开发语言有PHP、Python、Java三种可选，单纯的是用S5做幻灯片，这三种开发语言随便选，我们用不着，如果你是准备开发微信，那么选择移动并把开发语言设定为PHP。

关于SAE的创建，我不多说了，后面有机会再出个小教程（虽然可能性很小），我们唯一需要做的是就是将你编辑好的S5的个人版幻灯片打包上传即可～～

现在我们切入今天的正题，S5作为一门高BQ的技能，要想耍的好，还是有基本要求，你必须有基本的网页编辑知识——JS+CSS+HTML基本知识若干，这些技能越熟练，你的幻灯片也就越炫，当然大部分只要实用即可，网上有很多现成的样式模版可以拿来直接用，不是吗。

以它最基本的blank空白demo（范例）来说，你只需要编辑那个html文档即可，要想增加一个幻灯片，直接添加一个class为slide的div即可，然后页面的标签根据官方的介绍来编辑，链接如下：

http://meyerweb.com/eric/tools/s5/structure-ref.html

对于熟悉的CSS与JS的同学，想要改变幻灯片的样式以及播放效果，可以先去了解一下它的文件关系图：

http://meyerweb.com/eric/tools/s5/filemap.html

S5的官方链接如下：

http://meyerweb.com/eric/tools/s5/

本来没有准备写这篇文章，但陆陆续续有朋友问我“建网站”的事情，这也是我上篇文章提到的“不好的问题”，但我细想自己以前也犯过这样的毛病，再仔细思考，发现自己当时是对网页、网站有很浓的兴趣，很好奇如何在互联网上让别人看到自己写的网页，但当时某些学长，就搬出各种各样的术语，如“服务器”、“Ajax”等，小伙伴当时就吓尿了，信心损半，兴趣也立即降到最低点，后面自学后，才明白也就那么回事儿，得出的结论就是：做网站容易，经营网站难。怎么听怎么像“创业容易，守业难”。

基于以上的考虑，于是我想到介绍这些免费、交互优良的服务，大家注册后，几步就能建好属于自己的网站，那种成就感，想起来就让人高兴。所以希望今天我的分享能够让更多的人保有那份对计算机、对互联网的热情，这也是我作为自媒体存在的价值！！！

＝＝＝只做最真实的自己＝＝＝

微信公共号IT百问

关注方式：

1、打开微信搜索微信号ID：itbaiwen

2、或者扫描下方的二维码

回复m查看5篇文章列表

举报