轩枫阁

首页 / 搜索标签: 创意

基于Canvas实现的炫酷3D动画大背景

前言

HTML5 中新增标签Canvas,Canvas 对象表示一个 HTML 画布元素 -<canvas>。它没有自己的行为,但是定义了一个 API 支持脚本化客户端绘图操作。利用JS,可以实现一些超炫酷的效果。本文所介绍的是基于Canvas实现的炫酷3D动画大背景。

案例一

原版

QQ 官网 http://im.qq.com/pcqq/

demo

http://xuanfengge.com/demo/201411/vector/demo1.html

使用

为方便大家使用,轩枫阁已将主体代码抽出,并示范使用方法(具体看源码),只需加载相关JS并调用即可。不依赖jQery,但是需注意代码执行顺序。

特点

改变3D大背景块颜色,清晰可见,适用于文字较少、加以配图的页面。 查看全文

2014/11 15  周六

HTML5程序员的浪漫爱心表白动画

简介

我们程序员在追求爱情方面也是非常浪漫的,某位同学利用自己所学的HTML5知识自制的HTML5爱心表白动画,画面非常温馨甜蜜,这样的创意很容易打动女孩,如果你是单身的程序员,也赶紧来制作自己的爱心表白动画吧。

在线演示

http://xuanfengge.com/demo/201409/love/

程序源码

https://github.com/xuanfeng/HTML5-love-you
查看全文

2014/10 12  周日

多说头像CSS样式自定义-让评论更炫酷

前言

所谓的社会化评论,即网站的评论系统集成“QQ、QQ空间、新浪微博,人人网、豆瓣”等社交账号及第三方平台的单点登录功能,实时评论同步,实名制留言将大大提高评论的质量和传播效率。通过插件安装、插入代码等方式使用社会化评论。如今wordpress、DedeCMS、DISCUZ等众多博客均可使用。

现今的社会化评论系统,主要有:友言多说畅言灯鹭

轩枫阁从13年3月上线时,一直使用多说,只因其UI及体验吸引住了我。使用灰色背景,完美搭配多说自带主题,无需自定义CSS。但是最近发现多说的自定义CSS功能结合CSS3可以做一些炫酷的效果,主要是针对头像。

关于多说

多说是一款追求极致体验的社会化评论框,可以用微博、QQ、人人、豆瓣等帐号登录并评论。多说帮助用户搭建更活跃,更互动的评论平台,功能强大且永久免费。它正在改变网站与用户之间,用户与用户之间的互动方式。这个专门基于社交网络的评论系统,能够轻松的帮网站主搭建自己互动性极强的社区,让留言的用户都有“家”的感觉。

效果图

查看全文

2014/08 30  周六

CSS3黑白滤镜grayscale的应用

前言

CSS3 Filter与我们所熟悉的CSS Filter是完全不同的两个概念,也不是所谓的IE滤镜,它是指通过CSS或SVG渲染元素概念可以描述的元素,包括子元素。

语法

语法很简单,grayscale的参数中100%表示黑白色调,0%表示彩色。

demo

链接

http://xuanfengge.com/demo/201408/gray/ 查看全文

2014/08 17  周日

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子