css3

Coda2 Video tag

-
Free tags: 

Coda2 是一個最近發佈的 editor
因為介面使用很友善而很火
但我並不是談它的好, 而是它首頁上的 demo video

它的 demo video 原本沒有甚麼特別
但細心一看之下, 使用的是 <video>
mov 和 webm 雙 codec 也是正常普通技術

但我在觀看的時候暫停了一下
而它仍然有移動, 引起了我的注意
再番看才發覺, 是使用了 css3 作的 pan 的動作
video 本身的取鏡是沒有移動的, 是一條 1920x1080 的片
後加 transform, transition 等等後製
你細心留意的話還可以看到是使用了 3d transform 而沒有反鋸齒的

我不知道是為了方便還是一個實驗性的項目
但的確是有創意, 大膽的嘗試
我會因為這事而更加留意 Panic 這個團隊和它們的產品

weekend project: My 2011 Fall resume in HTML5

I just think I want to try out some webkit transition and animations
And I always think a web developer/programmer should have an online resume
so this is the weekend project

It do not use any new tags like article,
but only all those webkit transition and transformm, acting like slideshows
Nor i am an art designer, so i keep it really minimal in design.

Joetsuihk.com 為手機瀏覽提供最佳化 support various device by leveraging responsive web design

在 Drupal Camp Taipei 學到的一個技術, responsive web design
早就想要試試應用到我的 blog
最初是打算移除右欄, 然後覺得頁頂的導航欄都不需要那麼長
再修改一下留白的位置就完成了
整體來說只要你一直守著正確的, 語意化的 html的話
轉換應該是很簡單的
下面再有詳細的技術細節

Responsive web design learn from Drupal Camp Taipei, a tech that wanted to be applied to this blog since then. Aim: to support viewing articles on modern mobile/tablet devices. Starting with removing right sidebar, and then taken out a few top menu items, little spacing to work on smaller screens and that's it.

Google