HTML5

WebフォントをSVGからOTFに切り替えた際のハマりポイントあれこれ

WebフォントをSVGからOTFに切り替えた際のハマりポイントあれこれ

 先日、1年ほど前に公開したスマートフォン向け秀英体見本帳を更新しました!スマートフォン向け秀英体見本帳は、モバイルブラウザを対象としたWebフォントを使った縦組み表現に挑戦したコンテンツです。スマートフォン向け秀英体見 […]

position:fixedを実現するiScrollを使う際に覚えておきたいメソッドたち

position:fixedを実現するiScrollを使う際に覚えておきたいメソッドたち

ヘッダーやフッター等の要素を固定表示するのに利用されるposition:fixed。このposition:fixedがサポートされていない環境で、固定表示を実現する際によく使われるライブラリにiScrollがあります。要 […]

Gruntで快適な環境を整備したい!【タスク記述編】

Gruntで快適な環境を整備したい!【タスク記述編】

『Gruntで快適な環境を整備したい!【インストール編】』に引き続き、タスクの自動化ツールであるGruntを使ってみます。今回はタスク記述編ということで、様々なタスクを書いてみます。   今回したいこと   今回は以下の […]

Gruntで快適な環境を整備したい!【インストール編】

Gruntで快適な環境を整備したい!【インストール編】

みなさんはHTML/JS/CSSベースの開発をする際、どんな開発環境で開発していますか?今回は快適な開発環境を目指して、Gruntというタスクの自動化ツールを使ってみます。使用するGruntのバージョンは0.4.1です。

Sass/Compassを使ってCSSスプライトに挑戦してみました。

Sass/Compassを使ってCSSスプライトに挑戦してみました。

CSSスプライトを作成する機会があったため、最近よく耳にするSassとCompassを使ってみました。CSSスプライトとは、複数の画像を1枚の画像としてまとめ、CSSで表示範囲を指定することにより表示する手法です。画像の […]

HTML/JSで画像リクエストをキャンセルさせるには?

HTML/JSで画像リクエストをキャンセルさせるには?

本ブログのWEB標準技術系の記事では、これまでHTML5関連技術やUIフレームワークについてご紹介してきましたが、今回は画像リクエストのキャンセル方法について考察してみたいと思います。     例えば上の画像のように、画 […]

Sencha Touch2でWebアプリ開発【MVC概要編】

Sencha Touch2でWebアプリ開発【MVC概要編】

前回からだいぶ間が空きましたが、MVC概要編ということでまとめた資料を公開します。 Model/View/Controller + Store + Profileの5つについて、 図にあるような、ボタンを押したらフォーム […]

Sencha Touch2でWebアプリ開発【基礎編】

Sencha Touch2でWebアプリ開発【基礎編】

先日、社内でSenchaTouch2の勉強会を行いました。「基礎編」「MVC編」のうち、今回は「基礎編」の資料を公開します。SenchaToush2でモバイルアプリを開発するための開発環境やコンポーネントの追加方法、イベ […]

主要なモバイルUIフレームワークを比較してみました

主要なモバイルUIフレームワークを比較してみました

WEB標準技術でアプリケーションを開発するためのUIフレームワークが増えてきました。モバイルWEB向けの業務アプリケーション開発に有用なUIフレームワークを選定するため、主要UIフレームワークのUIコンポーネントを中心に […]

スクロールでDIV要素を動かす基本

スクロールでDIV要素を動かす基本

最近よく見かけるスクロールと連動してダイナミックに表示が変わるサイトは、 「そもそもどんな仕組みなんだろう?」と、ふと疑問に思いましたので、 スクロールの位置によってDIV要素を移動したり、回転するといった基礎的なところ […]