Jade – 簡化 HTML

寫了HTML 都很多年了,HTML 一直存在問題,就是HTML Tag 打起上來不方便,而且當一個 HTML 檔案的行數達到一定數量時,變得很難看。

Jade 就是嘗試把 HTML 簡化,剛才試用了一下,打起上來真的很舒服,而且都易明。

JADE Source Code:

doctype html
// Created by Louis Lam on 12/10/2014.

html
    head
        title HELLO WORLD!
        meta(charset=“utf-8”)
body
    div HELLO WORLD!
    div(id=“abc”)
    script(src=”//code.jquery.com/jquery-1.11.0.min.js”)
    script.
        var abc = “ABC!”;
        $(“#abc”).html(abc);

HTML:

<!DOCTYPE html>
<!— Created by Louis Lam on 12/10/2014.—>
<html>
<head>
    <title>
HELLO WORLD!</title>
    <meta
charset=“utf-8”>
</head>
<body>
    <div>
HELLO WORLD!</div>
    <div
id=“abc”></div>
    <script
src=”//code.jquery.com/jquery-1.11.0.min.js”</script>
    <script>
        var
abc = “ABC!”;
        $(“#abc”).html(abc);
    </script>
</body>
</html>

[開發筆記] [Webshim] 幾個 Checkbox 最少選一個

HTML5 的表單驗証已非常好用,但都有美中不足,就是不可驗証多個 Checkbox 最少選一個。而 Webshim 十分貼心,補救了這個問題。

1. 假設你已安裝 Webshim

<script>
$.webshims.polyfill();

$.webshims.setOptions(‘forms’, {
        addValidators: true
});
</script>

2. 加 class=”group-required”  data-grouprequired=” 到其中一個 Checkbox 中,以下是例子

<input type=”checkbox” name=”pet[]” value=”dog” class=”group-required” />
<input type=”checkbox” name=”pet[]” value=”cat” />

完成

Source: http://afarkas.github.io/webshim/demos/demos/webforms/4-webforms-custom-validity.html

http://stackoverflow.com/questions/6218494/using-the-html5-required-attribute-for-a-group-of-checkboxes

fontcapture – 自製字型

F4dsjp

2009-09-04_151955

以上嘅字都係我自己寫嘅字,都有趣。

過去製造字形都要經過一個煩複嘅過程,不是一般人可以做到的事情。而fontcapture就簡單得多,只要有Printer, Scanner,跟著一步一步做,花少少時間就可以了。

不過我就冇Scanner,用相機影出嚟啲色硬係灰灰地,唔得。所以都要PS一下 (其實我用PhotoImpact-.-),但啲字始於都係深淺色不均混。

網址:http://www.fontcapture.com

都係懶得整嘅話,就下載我字型XD
下載完Copy 到 C:WindowsFonts
之後開Word 等軟件揀字型,搵"LouisLam"

下載:http://cid-2197b6d36b4c854c.skydrive.live.com/self.aspx/Software/LouisLamFont.ttf

DSC01134  DSC01136 form_template_1