» ドローソフトでデザインしたグリフの読み込み方 (2) mshio's blog
前回は、FontForge に読む込むためのファイル形式の話と、実際に読む込むための操作手順について書きました。 しかしグリフの数というものは、もとより 1 つや 2 つで済むものではありません。日本語フォントともなれば、ずいぶん多くのグリフを扱わねばならず、それをいちいちマウスで手順どおりやるとなると、FontForge に読み込むだけでも手間になります。 このような大量の定型処理に便利なのが、プログラムによる自動処理です。FontForge には、スクリプトで操作できるようなインターフェイスが用意されていますから、もしこれを使ったらどうなるか、というのを今回書いてみたいとおもいます。 FontForge のスクリプトは、C 言語とシェルスクリプトの中間みたいな独自言語と、Python が用意されているようです。私は個人的に Python が多少使えますので、Python でやってみまし
Animated SVG Icons - Snap.svgを使ったアニメーションするアイコン MOONGIFT
これは覚えておくと良さそうですよ！ スタイルシートやJavaScriptを使ってマウスオーバーで画像を差し替えたりする操作は良くありますが、その発展版とも言えるのがAnimated SVG Iconsです。 SVGを使ったアイコンをクリックやマウスオーバー時にアニメーションしながら表示変更してくれるライブラリです。 画像だと分かりづらいですのが、例えばこちらがデモです。 時計と矢印に注目。 矢印をクリックすると、 向きが反対になりました。 同様に時計をクリックすると、 針が回転しました。 試した動画はこちらです。 クリックの他、マウスオーバー時のイベントも指定できます。またアニメーションの速度も変更可能で、より目を引くアクションに設定も可能です。 Animated SVG IconsではSnap.svgを使ってSVGの制御をしています。実際の指定としては次のようになります。 clock :
[CSS]水平に配置したセクションを分けるスタイルのさまざまな素敵なテクニック
1ページに複数のセクションを水平に配置した際に、それらの区切りとなるさまざまなスタイルを紹介します。 縦長の1ページで構成されたプロモーションサイトやポートフォリオなどで見かけるものだけでなく、こんなこともできるのかとアイデアが素晴らしいものもたくさん！ デモページ 各デモと共にそのスタイルを紹介します。 まずはHTMLから。基本となるのは、2パターンです。 1つ目は、section要素にclassをつけるだけ。 <section class="ss-style-hogehoge"> コンテンツ </section> 2つ目は、svg要素を使用します。 <section> コンテンツ </section> <svg id="hoge"> SVGの中身 </svg> sctionだけの場合はclass、svgを使用するものはidになっています。 以下、各デモとそのスタイルです。 HTML/C
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
