サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
lab.hops.co.jp
ホップスの辻です。 先日HTML5のロゴが発表されました。 このロゴを見て、ハッとしました。 「将棋の駒じゃないか」と。 ・・・できました! 今回開発したこの、HTML5将棋は非常に画期的で、 駒には手にも優しく軽いプラスチックを採用。 将棋盤には激しいバトル魂に火を付ける放射状のイラストを採用しました。 弊社の女流棋士にも一局やっていただきました! Click here to view the embedded video. 作ってみたけど、どれがどの駒かわからないねェ おしまい。
こんにちは、ホップスの辻です。 最近HTML5について、ちょこちょこ調べてたりします。 そんな中面白いプラグインが公開されたので紹介したいと思います。 AdobeのIllustratorからHTML5のCanvasに変換するプラグイン「Ai2Canvas」です。 CanvasはJavaScriptで画像を描画する仕組みで、SVGにちょっと似てますね。 いままでは自分で計算した数値を入力しながら作成しないといけませんでした。 これは非常に手間がかかり、面倒でした。 しかし今回公開された「Ai2Canvas」を使う事により、 結構複雑に書かれているIllustratorのパスでもボタン一つで書き出し、 ブラウザで確認する事ができます。 ■Ai->Canvas http://www.visitmix.com/labs/ai2canvas/ インストール方法 インストールは簡単です
ホップスの辻です。今回はキャッシュマニフェストをご紹介します。 キャッシュマニフェストを使うと、ローカル上(自分のパソコン)にファイル(htmlやjpg等)をキャッシュできます。 通常のブラウザのキャッシュの最強版みたいな感じです。 キャッシュマニフェストを使用しているサイトなら、初回アクセス時にはキャッシュ(ローカルに保存)をし、次からはローカルからファイルを見るので高速化が期待できます。 さあ、早速使ってみよう! まずは確認用のブラウザを準備しましょう。 2010年6月29日段階では以下のブラウザで使用できます。必要に応じてダウンロードしましょう。 1)Firefox 3.6.6 [ダウンロード先] 2)Safari 5.0 [ダウンロード先] 3)Google Chrome [ダウンロード先] マニフェストファイルを作る キャッシュマニフェストを使う場合には「好きな名前.mani
ホップスの辻です。 よし!サイトをコーディングするぞ!あれ?あのCSSなんて書くんだ? あるある!!よくある! そんな時ようのCSSの書き方のまとめです。 min-height:指定した高さ以下には小さくならないようにする方法 [css] //ID=”demo”は100px以下にはなりません。 #demo { min-height: 100px; height: auto!important; height: 100px; } [/css] 参考サイト:CSS でmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 cursor:マウスのカーソルのアイコンを変更する方法 これが一番利用するかもね。 [css] #demo { cursor: pointer; //指のアイコンになる }
ホップスの辻です。 jQueryって凄く便利で大好物なんですが、たま~に「あの機能ってどうやるんだ?」と忘れてしまう事があります。 ちょっと自分用にまとめておきますが、暇をみてドンドン追加していきますよ。 jQueryの便利なプラグインや使い方のまとめ、2010年梅雨版@ホップス まずはjQuery本体のダウンロード先 2010年7月1日現在の最新版は、v1.4.2です。 [http://jquery.com/] トップへ戻る(gototop)を押したらページの上部に滑らかにスライドする方法 これは結構利用しますよね。ページに下からなめらか~にスライドして、上に戻るおなじみのアレです。 ページ内のという物全てが対象になっています。 [javascript] jQuery.easing.quart = function (x, t, b, c, d) { return -c * (
HOPS Laboratoryでは最新のWeb技術を研究しています。ホップスの辻です。 今なにかと話題のHTML5。先日はcache manifest(キャッシュマニフェスト)のお話をしましたね。 HTML5のcache manifest(キャッシュマニフェスト)を導入してみよう! HTML5の中でも今もっとも注目度の高い機能に「canvas(キャンバス)」というものがある。このタグを使うと、javascriptと組み合わせて簡単に図形を書いたり、アニメーションをしたりできます。Flashではプラグインという形でFlash Playerを入れなければいけませんが、canvasはブラウザ側が既に実装しているので何も必要ありません。 今回は今もっとも熱いcanvas(キャンバス)タグを使って、醤油ラーメンを描きたいと思います。 canvas使ってモテたい!でもその前に・・・ ようしcanva
ホップスの辻です。 今なにかと話題のHTML5。先日はcache manifest(キャッシュマニフェスト)のお話をしましたね。 HTML5のcache manifest(キャッシュマニフェスト)を導入してみよう! HTML5の中でも今もっとも注目度の高い機能に「canvas(キャンバス)」というものがある。このタグを使うと、javascriptと組み合わせて簡単に図形を書いたり、アニメーションをしたりできます。Flashではプラグインという形でFlash Playerを入れなければいけませんが、canvasはブラウザ側が既に実装しているので何も必要ありません。 今回は今もっとも熱いcanvas(キャンバス)タグを使って、醤油ラーメンを描きたいと思います。 canvas使ってモテたい!でもその前に・・・ ようしcanvas使っちゃぞ!その前にcanvasが動くブラウザの準備です。 20
このページを最初にブックマークしてみませんか?
『HOPS Laboratory | もっと、創造的に。』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く