画像などを埋め込み可能にする data URL スキーム (RFC2397) - seclan のほえほえルーム
ウェブブラウザには、RFC で定義されている URI を処理するためのルーチンが組み込まれています。Mozilla Firefox や Opera は、そのうちの一つである RFC2397 で決められている data URL スキームを処理できます。このスキームは、html などのファイルの中に、通常リソースへのリンクを指定する場所に、直接データを埋め込むためのスキームです。そのため、複数のファイルを扱う必要がなくなるという利点が生まれます。具体的な書式は次のとおりです。 data:[MEDIATYPE][;base64],DATA ここで、MEDIATYPE は、インターネットでよく用いられている image/png や text/plain;charset=US=ASCII などで表現されているメディアを指定する文字列です。;charset=US=ASCII などのオプションも指定可能
[JS]地味なフォームを簡単にかわいらしいデザインにする -Ideal Forms
画像を一切使用せず、既存のフォームをかわいらしいデザインに変更するjQueryのプラグインを紹介します。 チェックボックスのチェックも画像ではないですよ。 Ideal Forms デモ [ad#ad-2] Ideal Formsのデモ フォームの外観は画像は使用せずスタイルシートでデザインされているので、自分用のカラーに変更することも可能です。 デモでは、3つのスタイルが用意されています。 スタイル：Comix Ideal Formsの主な特徴 フォームに美しい外観を与える軽量（14Kb）のスクリプト。 カスタマイズも簡単で、非常に使いやすいです。 画像は必要なく、スタイルシートでデザインを適用しています。 [ad#ad-2] Ideal Formsの実装 ファイルのアップロード 以下の2つをフォルダごとアップロードします。 css/idealForms js/idealForms.js
JavaScript+HTML5で作られたゲーム「Canvas Rider」が面白い - 強火で進め
Canvas Rider http://canvasrider.com/ 「Canvas Rider」は手描きの絵をMTBのコースしたゲームです。 こちらのベットルームをコースに見立てたものは難易度が高めでお勧めです。 Canvas Rider - 3D Bedroom by moose_man http://canvasrider.com/tracks/29472 操作方法はこちら。一度、ゲーム画面をクリックしてフォーカスを当ててからキー入力をして下さい。 enterキー : リトライ カーソルキー : アクセル/ブレーキと体重移動 Bキー : バイクの種類を変更 Fキー : フルスクリーン Zキー : 進行方向の変更ｚ スクロール : 画面の拡大・縮小サイトの上部に有るタブで全てのコースの中からやランダムにコースを選択する事が出来ます。
Webブラウザ用Twitterクライアント·twicli MOONGIFT
twicliはHTML/JavaScript製のオープンソース・ソフトウェア。Twitterクライアントは無数に存在する。Windows、Mac OSX、Linux用からはじまり、iPhone、Android、Windows Phone向けにも多数ある。さらにブラウザ機能拡張として提供されるものも多い。 タイムライン そんな中、異色とも言えるのがWebブラウザ上で提供されるTwitterクライアントだ。元々TwitterはWebサービスだが、クライアントしての機能に特化させることで魅力的になる。その一つがtwicliだ。 twicliはOAuthを使っているのでパスワードを保存する必要もなく、さらにデータベースもいらない。JavaScriptとHTMLのみで動作する。タイムラインはもちろん、MentionやDM、検索結果を見ることもできる。お気に入り登録やReplyもできるので必要な機能は
Navigation Timing (Editor's Draft)
The NavigationTiming draft is now located under the Mercurial repository. You will be redirected in a second...
Nerine - Simple HTML5 Presentation Tool
Simple HTML5 Presentation Tool About Download Usage Petal About HTMLで手軽にスライドが作れたら楽なのにというものぐさな気分から生まれた、出来る限り綺麗なHTMLの書けるHTMLプレゼンテーションツールです。 デモ / ちょっとカッコつけたデモ How to use Downloadから、ファイルセットをダウンロード アーカイブを展開 example.htmlを参考にしながら、ぽちぽち書く CSSでお好きな見た目をつける(Effect PetalはPetalから) 推敲する 3に戻る Requirement jQuery Safari / Google Chrome / Firefox License どれならいいのかわかりませんが、GPLだと思います！ Download stable: Zip Archive develo
Google、Quake IIをJavaScript＋HTML 5で実装 | スラド IT
ストーリー by hylom 2010年04月08日 14時00分 ブログ記事の公開は4/1だがエイプリルフールネタではない 部門より やや旧聞となるが、Googleが往年の名ゲーム「Quake II」をJavaScriptおよびHTML 5で実装したとのこと（Google Web Toolkitブログ）。 これは、Quake IIのJava移植版「Jake2」をベースに、Google Web Toolkit（GWT）を利用するよう修正し、GWTのクロスコンパイラを使ってJavaScriptに変換したもの。開発者らのノートPCで、30FPS以上で動作したという。 描画にはOpenGLアクセラレーションを利用する「WebGL」を利用しているとはいえ、ゲームのプレイ画面を見る限りはWebブラウザ上で動いているとは思えない出来映えである。ソースコードはGoogle Code上で公開されている。
Webブラウザで動画編集！ - Yanagi Entertainment
html5で videoの任意のフレームをcanvasに描画するメモ - 超自己満足プログラミング http://d.hatena.ne.jp/favril/20100225/1267099197 昨日この記事を見て、これはすごい！ すごいすごい！ ってなって、これができるんならWebブラウザだけで動画編集できるんじゃね？ と思ったりしたので、ざっくり作ってみました。 http://yanagiatool.appspot.com/jsvideo/player.html （MacのSafari4で動作確認。QuickTime + ChromeならWindowsでもいけるかも？） あそびかた 「動画を読み込む」ボタンを押すと、テキストボックスに入ってるurlの動画を読み込みます。「state」って書いてあるところが「stand by」になったら「再生 / 停止」ボタンを押してください。 あとは
HTML＋JavaScriptでiPhone/Androidアプリを作れるTitanium Mobileとは
HTML＋JavaScriptでiPhone/Androidアプリを作れるTitanium Mobileとは：Web技術でネイティブアプリを作れるTitanium（1）（1/3 ページ） iPad/iPhone VS Androidに戸惑っているWebデザイナ／開発者のために、Web技術でネイティブアプリを作れるオープンソースの開発ツールを紹介し、その利点や使い方を連載で解説します iPad/iPhone VS Androidに戸惑っていませんか？ 2010年1月5日、グーグルがAndroid 2.1を搭載した「Nexus One」を発表しました（参考：Google、Android 2.1搭載の“スーパーフォン”「Nexus One」を発表）。高精細なディスプレイや高速なプロセッサによる快適な動作など、iPhoneのライバルとしての存在感が話題になりました。また1月21日には、NTTドコモ
MacRuby: The Definitive Guide
Build the skills your teams need Give your teams the O’Reilly learning platform and equip them with the resources that drive business outcomes. Click on a feature below to explore. Trusted content Live online events Courses Interactive learning Certification prep O’Reilly Answers AI Academy Assignments Insights Dashboard Trusted content you can count on More than 60K titles from O’Reilly and nearl
HTML/JavaScript/CSSをシェイプアップ！·Patu Digua MOONGIFT
HTMLやJavaScript、CSSを構造化して見やすく書こうと思うとインデントやスペースを使うだろう。確かに見やすいが、ブラウザへのレンダリングを行う上では特に意味はない（中には意味のあるスペースもあるが）。できるだけ転送量を抑えようと思うと、このスペースをなくしていくという作業が大事になる。 HTML/JavaScript/CSSのサイズを軽減 そのためのツール（難読化ツール）はいくつか存在するが、HTML/JavaScript/CSSのいずれにも対応したものは多くない。そこでPatu Diguaだ。 今回紹介するオープンソース・ソフトウェアはPatu Digua、HTML/JavaScript/CSSからスペースやコメントを排除するソフトウェアだ。 Patu DiguaはJavaで作られたソフトウェアで、Windows/Mac OSX/Linuxで動作する。指定したファイルからコメ
[js][html5][websocket] web_socket.js - HTML5のWeb SocketをFlashを使って実装 - monthly gimite
HTML5のWeb Socketを、Flashの力を借りて実装してみました。 gimite / web-socket-js - GitHub Web SocketはHTML5に入る（予定の？）機能で、JavaScriptから生のTCP Socketに近いもの*1を使えるようにしよう、というものです。 2009年11月頃にChromeの開発版で実装されましたが、ほかのブラウザでは未実装です。このライブラリを使うと、すべてのブラウザで（Flashが入っていれば）Web Socketが使えるようになります。 使い方はこんな感じです。 // おまじないその1: JavaScriptライブラリの読み込み <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript" src="web
![[js][html5][websocket] web_socket.js - HTML5のWeb SocketをFlashを使って実装 - monthly gimite](https://cdn-ak-scissors.b.st-hatena.com/image/square/f9f270d6c5b66de7437a50fd9e0e7785d5d31601/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F12704346814673860630%2F17680117126973993697%2F1550668916)
ウィンドウの有効幅(height)を取得するJavaScript screen.availHeightだとステータスバー等も含んでしまっているような数値が出てしまうので、ステータスバー等…
ウィンドウの有効幅(height)を取得するJavaScript screen.availHeightだとステータスバー等も含んでしまっているような数値が出てしまうので、ステータスバー等を含めない、実際の有効縦幅を出せる方法がありましたら教えて下さい。
HTML5 Web Database仕様を、Gearsを使って実装しました。 - IT-Walker on hatena
HTML5 Web Databaseを、Gearsを使って実装しました。 どうせなら、Web Database以外のAPIもGearsで実装するようなプロジェクトにしてはどうかと思い、新しくGoogle Codeにプロジェクトも作成しました。その名もです。ルフィにカッコよく必殺技コールしてもらいたいです。 一番の利点は、Gearsがインストールされていればどこでも動くことです。Gearsは、Internet Explorer6+、Firefox 1.5+、Safari3.1.1+、Chrome1.0+あたりで動きます（残念ながら、Firefox3.5にはまだ未対応）。IE6で、HTML5のWebアプリ用APIが使えたら結構素敵じゃないですか？ Gearsは2年くらい前にGoogleがリリースしたオープンソースプロダクトで、ブラウザプラグインとして動作し、ブラウザに対して様々な機能を付け加え
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML＋JavaScriptで作れる Windows 7デスクトップアプリの基礎知識
Create a new fiddle - JSFiddle
Rendur 2.4
[JS]ブラウザのサイズに合わせてレイアウトを自動変更するチュートリアル