[JS]フォントを使用した画像のように、テキストを自動変更するスクリプト -typeface.js

typeface.jsは、テキストを自動置換し、フォントを使用した画像のようにSVGに変更するスクリプトです。

デモのキャプチャ

画像クリックで、複数のサンプル表示。
typeface.js -- Rendering text with Javascript, canvas, and VML
demo

使用方法は簡単で、typeface.jsとフォントのJSを外部ファイルとして、適用するテキスト箇所にスタイルシートで指定を行います。
「line-height」「letter-spacing」も指定することができます。

対応ブラウザは、IE6+, Fx1.5+, Safari2+となっており、Fx, Op, Safariではcanvas、IEではVMLを使用しています。

現在ダウンロードできるフォントは英字のみで、Helvetiker, Optimer, Gentilisの3種類となっています。

fontのサンプル

font download

sponsors

top of page

©2018 coliss