Ben Joffe |Torus
How To Play Use the arrow keys to guide the falling blocks, spacebar and the up-arrow will rotate the block in opposite directions. Alternatively the keys A,W,S and D can be used as arrow keys for the same purpose. When a complete horizontal ring of 15 blocks is occupied by pieces the row will collapse and earn 100 points. If multiple rows are cleared at a time you will earn bonus points.
Nihilogic
Saturday, September 20, 2008 9 comments Mandelbrot in less than 128 bytes of DHTML Labels: javascript A while ago, Mathieu "p01" Henri rendered the initial Mandelbrot set in 137 bytes of JavaScript and HTML, getting it down to 133 bytes with a few tweaks but still a few bytes short of his 128 byte goal. Since fractals are groovy, I decided to make my own, trying to get it below that magic number.
無限にAmen Breakを再生するウェブサービス - hitode909の日記
無限にAmen Breakを切り刻んで再生し続けるウェブサービスを作った．Firefoxで動く． WindowsのFirefoxだとちょっと音が途切れたりするらしい．Macだとちゃんと動く． 追記 Google Chromeで見ると意図せず音割れしてめちゃくちゃかっこいい音が出る．原因は不明． Amen Amen BreakのwavファイルをXHRで取ってきて，JSでバイナリを解析して，ビートごとに分割して，それをランダムに並べることで，新しいパターンを作ってる． 音はaudioタグで，波形はcanvasで出してる． ビートごとに分割してるので，ランダムに並べても，ちゃんとそれっぽく聞こえる． 参考 Amen break - Wikipedia, the free encyclopedia Amen Breakについて． GlitchMonkey for Greasemonkey char
JavaScriptでCAPTCHA破り·Megaupload auto-fill captcha MOONGIFT
汎用的なものではないが、技術的には非常に興味深い代物だ。Webサイトではロボットによるクローリングを防止するためにCAPTCHAと呼ばれる仕組みを導入していることがよくある。ぐにゃぐにゃな文字で、人であれば読めるがコンピュータには読めないであろう文字を表示して人かロボットかを判別するのだ。 上に表示されている画像を解析して文字として表示するデモ だがただ文字を画像化したくらいではOCRのような仕組みを使って読まれる可能性がある。それを示したのがMegaupload auto-fill captchaだ。 今回紹介するフリーウェアはMegaupload auto-fill captcha、MegauploadのCAPTCHAを破るGreasemonkeyだ。ソースコードは開示されているがライセンスは明記されていなかったのでご注意いただきたい。 Megaupload auto-fill cap
John Resig - OCR and Neural Nets in JavaScript
A pretty amazing piece of JavaScript dropped yesterday and it’s going to take a little bit to digest it all. It’s a GreaseMonkey script, written by ‘Shaun Friedle‘, that automatically solves captchas provided by the site Megaupload. There’s a demo online if you wish to give it a spin. Now, the captchas provided by the site aren’t very “hard” to solve (in fact, they’re downright bad – some examples
HTML5のcanvasを使って醤油ラーメンを描いてみた！！ | HOPS Laboratory
ホップスの辻です。 今なにかと話題のHTML5。先日はcache manifest（キャッシュマニフェスト）のお話をしましたね。 HTML5のcache manifest（キャッシュマニフェスト）を導入してみよう！ HTML5の中でも今もっとも注目度の高い機能に「canvas（キャンバス）」というものがある。このタグを使うと、javascriptと組み合わせて簡単に図形を書いたり、アニメーションをしたりできます。Flashではプラグインという形でFlash Playerを入れなければいけませんが、canvasはブラウザ側が既に実装しているので何も必要ありません。 今回は今もっとも熱いcanvas（キャンバス）タグを使って、醤油ラーメンを描きたいと思います。 canvas使ってモテたい！でもその前に・・・ ようしcanvas使っちゃぞ！その前にcanvasが動くブラウザの準備です。 20
「HTML5のcanvasで作る画像フィルター」は自分ならこう書く - by edvakf in hatena
ASCII.jp：HTML5のcanvasで作る画像フィルター｜古籏一浩のJavaScriptラボ こちらの記事をたまたま拝見して、コメント欄もなければトラックバックもできないようなので、どうやって反応を返せばいいのかわからないけれど、もし古籏一浩さんご本人が見てくれたらいいなあ、ということで書きます。 全体的にはとても素晴らしい記事なのですが、いくつか言いたいことがあります。 ImageData まず、CanvasRenderingContext2D#createImageData というメソッド。これは知りませんでした。 Opera には window.ImageData というグローバルオブジェクトとして似たものが定義されています。(createImageData と違い、第三引数に配列を渡せるのが特徴ですが) if (window.CanvasRenderingContext2D
HTML5のcanvasで作る画像フィルター (1/6)
現在の主要なWebブラウザーには、グラフィックを自由に描画できる「canvas」機能が用意されています（Internet Explorerを除く）。canvasは、W3C（World Wide Web Consortium）で策定が進んでいる「HTML5」に含まれる新しい要素です。HTML5の仕様はまだ正式に決まっていませんが、canvasは仕様策定の早い段階から盛り込まれていたため、すでに多くのブラウザーに実装されています。また、canvasへの対応が遅れているInternet Explorer（IE）でも、「ExplorerCanvas」などのJavaScriptライブラリーを使えば、ある程度の機能をエミュレートできます。 canvasのサンプルでは、円や四角形のような図形を描画するものをよく見かけますが、今回のJavaScriptラボでは、ビットマップ画像をピクセル単位で加工する「画
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
Medama Cherenkov Maker
色: 半径(0 - 100): 放射(0 - 100): 乱数色相(0 - 360): りせっと ここ↓に画像ファイルをドラッグ＆ドロップしてね。
HTML5 Canvas
∧_∧ _（ ´・ω・）_ /＼`'⊃(;;ﾟ;;) ＼ ＿＿＿ ／ ※ ＼_＿＿＿_|＼＿＿ヽ ＼※ ※ | |_三三|_＜ はじまるよ！ ＼ / ※ ※ ※!､_ |||＿＿|､ `─────||ヽ───i§ ヽi |`〜〜 JavaScript でも 3D くらい できるさ！ amachang 先生の 次回作にご期待ください ∧∧ （ ･ω･） ＿| ⊃／(＿＿_ ／ └-(＿＿＿_／ ￣￣￣￣￣￣￣ - 完 - ごめんなさい ごめんなさい＞＜ DOM パフォーマンス チューニング JavaScript の 誤解 JavaScript は 遅い JavaScript は そこそこ速い 論より証拠。 ベンチマーク マージソート 100 numbers × 3000 times JavaScript ActionScript code: http://s
Visualizing and Manipulating Audio in the Browser
Badass JavaScriptA showcase of awesome JavaScript that pushes the boundaries of what's possible on the web, by @devongovett. The Firefox team has been busy working on the HTML5 Audio Data API, which lets JavaScript code interact with the Audio tag in a bidirectional manner. Developers have been busy putting together some cool demos of what the API enables, including visualizations using the Canva
canvasでキラキラした背景を作る方法 - KAYAC Engineers' Blog
tech.kayac.com、ささやかにリニューアルしました！ tech.kayac.comをご覧の皆さん、はじめまして。意匠部ME課のfuchigamiといいます。 どうして技術部ブログに意匠部の野郎が？って感じですが、 技術部ブログのリニューアル記念ということで、ちゃっかりcanvasについて記事を書こうと思います。 最初なので、、、 簡単にぼくの属性を説明すると、html5とか好き、CSS3とか好き、canvasとか興味ある、非モテ、javascriptはjQueryがなんとなくわかる程度、非リア充。こんな感じです。 今回のリニューアルではコーディング全般を担当しました。 特に、プログラミングに関してはド素人だ！ということを強調しておきます。 そんなぼくが、canvasを使ってキラキラした背景を作ってみました 「リニューアルするからには新しいことがやりたいよね。だったらhtml5とc
グーグルがO3Dの方針変換。WebGLに標準を統一し、O3DはJavaScriptライブラリへ
Webブラウザ上で3D表示（立体表示ではなく、遠近法などを用いた表示）を行うための仕様として、グーグルは昨年の4月にO3Dの開発を発表し、一方でモジラを中心にしたWebGLもそれ以前から標準仕様として開発が進められていました。 先週5月7日付けのグーグルの「The Chromium Blog」にポストされたエントリ「The future of O3D」で、グーグルはO3Dはこれまでの方針を変更し、WebGLをベースとしたJavaScriptライブラリとすることを明らかにしました。これにより、Webブラウザでの3D表示の標準APIはWebGLに一本化されます。 性能と環境に対するWebGLの懸念が払拭された グーグルがWebGLではなくO3Dを開発していた理由として、WebGLに関する2つの懸念があったことを明らかにしています。 1つはWebGLの性能です。WebGLはHTML5のCanva
Canvasによる3Dテクスチャマッピングとパフォーマンスチューニング（仮題） - 最速チュパカブラ研究会
MAX 打ち上げのときに川崎さんに「英語の記事書いたら絶対ウケるから書くべきだよ」と言われていつ書こうかなーと思ってたら、そういえば11日は休日だったので、日本語の下書きだけでも一気に書いてみることにしました。 といっても、欲を出してあれもこれも書こうとして、結局まだ書ききれてませんけど。 タイトル案 Javascript と Canvas によるフルスクラッチ3Dプログラミング Javascript と Canvas 3Dプログラミング入門 ドキッ JSだらけの あと、今日（11日）は私の誕生日でもあります。25になりました。そろそろ鏡を見るのが怖くなってきますね。 以下、書きかけ Introduction Adobe MAX 2009 で Spark Project は、拡張現実（AR）のデモを展示し、来場者の注目を集めていた。Shibuya.JS のメンバーもこのデモに感激し、是非
今更聞けないcanvasの基礎の基礎 - KAYAC Engineers' Blog
はじめまして。新入りのnagataです。 入社式で自転車乗ってた野郎です。 先輩方から「ブログ、書いてね！」とのお達しがあったので、 日報で書いたらウケがよさげだったcanvasのことについて書いてみようと思います。 ※各種サンプルはMac上のSafari4.05、Firefox3.6.3、Chrome5.0で動作を確認しています。 canvasってなんぞ？ 図を書き込めるhtml要素です。 OpenGLやDirectXのような面倒な設定を書くことなく、 手軽にグラフィック描画が行えます。 ブラウザだけでローカルアプリケーションのような グラフィカル（かつ動的な）表現が行えるわけです。 とりあえずつかってみる 早速何か描いてみましょう。 こういうことは実践あるのみです。 処理にはJavascriptを使います。 canvasに描画を行うときは、canvas要素からcontextを取得して、
Akihabara
Credits for music artists are on staff rolls of each games and here. Feel brave? So you're ready for the Dark side of Akihabara with experimental material! Uh-uh-uh! HTML5 is my Arcade. Akihabara is a major Tokyo shopping area for electronic, computer, anime, and otaku goods. You can find any sort of old & new videogames, starting from the 8-bit era to modern motion-sensing videogames. But is also
faviconでライフゲーム - 素人がプログラミングを勉強していたブログ
The Game Of Lifeに置いた。FirefoxとOperaではfaviconを動的にセットできるが、Safariでは不可能。 単にhrefを変えれば良いというものではなく、appendChild等でDOMツリー上の位置を現在のfaviconより下？にしなければ認識されない。 <!DOCTYPE html> <html> <head> <title>The Game Of Life</title> <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAEklEQVQ4jWNgGAWjYBSMAggAAAQQAAF/TXiOAAAAAElFTkSuQmCC"> <style> #canvas { display: none; } </style> <sc
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - novnc/noVNC: VNC client web application
Engadget | Technology News & Reviews
