CanvasのdrawImage APIは下図のように、ソースイメージ中の任意の矩形領域をCanvas領域中の任意の大きさの矩形にマッピングできます。 context.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh) このAPIによって、イメージの部分領域の縦・横方向の拡大縮小が自由にできるようになっています。 今回は、この拡大機能がちょっと気になったので以下のブラウザの各バージョンで調べてみました。 Firefox Chrome Safari Opera 3.6.11 8.0.552.11 dev 5.0.2 10.63 調べたのは、下のような赤と青が１ピクセル毎に交互に描かれているイメージを拡大したときの補間の表現です。 このイメージを下記表のように拡大してみました。 5倍 10倍 20倍 40倍 80倍 160倍 320倍 640倍 1
はじめに Canvasのパフォーマンスを測定するベンチマークプログラムはそこら中に転がっていますが、ほんの一部分の測定だったり、逆に中身が複雑過ぎたりと僕が希望するようなものが見当たらなかったので、自分で作って各ブラウザで測定してみました。 測定したブラウザのバージョンは以下です。 Chrome Firefox Safari Opera 9.0.570.1 dev 3.6.12 5.0.2 10.63 ベンチマーク 作成したベンチマークプログラムは単位時間で描画関数を何回繰り返して実行できるかという単純なものです。実行中に描画される絵のいくつかを載せておきます。 hlinebezierfill_arcfill_starsimage_scaleradial_gradient 以下に全測定項目の概要を記します。 hline ひたすら水平方向の直線を描きます。 vline 垂直方向の直線 lin
「Java News.jp（Javaに関する最新ニュース）」の安藤幸央氏が、CoolなプログラミングのためのノウハウやTIPS、筆者の経験などを「Rundown」（駆け足の要点説明）でお届けします（編集部） シェア競争に挑まないWebブラウザ「Safari」の登場 2008年3月、iPhoneの日本登場に先駆けて、Windows版Safari 3.1が登場しました（参考「Apple、Windowsにも正式対応の「Safari 3.1」リリース」）。 WebブラウザのシェアはFirefoxが健闘しつつも、いまだInternet Explorer（以下、IE）が大半を占め、多くのWebアプリケーションサービスにとって、IEへの対応が必須であると思われてきました。そんなWebブラウザのシェア競争の中へSafariが登場したことは、最初はとても異質なことに感じられました（参考「新しいWebブラウザ
HBO9 adalah tempat main game mobile resmi yang menghadirkan berbagai pilihan permainan online terlengkap dan mudah diakses kapan saja. Platform ini dirancang untuk pengguna mobile dengan tampilan responsif, ringan, dan stabil di berbagai perangkat. Melalui HBO9, pemain dapat menikmati beragam game populer dengan sistem yang adil dan transparan. Proses pendaftaran cepat, transaksi aman, serta dukun
1年ぐらい前からある無料サービスで、自分の作ったサイトやブログなどがほかのブラウザから見ると正常に見えているかどうかを画像として見せてくれるサービスです。特に自分が普段使っているOS以外の環境下での見え方がわかるので重宝します。 対応しているブラウザは、WindowsはFirefox1.0/1.5/2.0、K-Melon 1.0、MSIE 6.0/7.0、Mozilla 1.7、Navigator 4.8、Netscape 6.2/7.2/8.1、SeaMonkey 1.0。MacはSafari 2.0。LinuxはDillo 0.8、Epiphany 2.14、Firebird 0.7、Firefox 1.0/1.5/2.0/3.0、Flock 0.7、Galeon 2.0、Konqueror 3.3/3.4/3.5、Mozilla 1.7、Navigator 4.8、Opera 8.5
Ajax IME は Javascript を悪用しつつ強引にインラインかな漢字変換を実現しています． 簡単そうに見えて以外とややこしいのが，変換候補の表示. textarea のキャレット(カーソル) のピクセル単位での位置をなんとかして取得してその位置に変換候補を 出す必要があります． ありがちな google suggest ような補完インタフェイスだと inputbox の真下に出せばいいので位置は完全にわかるのですが，textarea は簡単ではありません． 調べた限り，どうやら標準ではキャレットの位置を取得できないそうです． ただし IE だと以下の方法でピクセル単位での位置がわかります. var caretPos = document.selection.createRange(); y = (caretPos.offsetTop + document.documentEle
SafariでXMLHttpRequestのresponseTextが文字化けするという話。 http://blog.33rpm.jp/garbled-on-safari.html 最近のバージョンだとcontent-typeがちゃんとしてれば化けなかったような記憶があるけど、まあともかくとして、Safariで文字化けするのはJavaScript側だけで対処することができたりする。 http://kawa.at.webry.info/200511/article_9.html これ読んでほんとかよ、って感じだったんだけど案外役に立った。livedoor Readerで使われてたり。 実際に使われてるコードはこんなの。 if(browser.isKHTML){ ajax.filter.add(function(t){ var esc = escape(t); return(esc.index
JavaScript を学ぶ際に一番重要なのに、誤解されがちな setTimeout 系の概念 http://d.hatena.ne.jp/amachang/20060910/1157911122 上記はてブコメント http://b.hatena.ne.jp/entry/http://d.hatena.ne.jp/amachang/20060910/1157911122 JavaScriptがシングルスレッドなのは仕様？ http://d.hatena.ne.jp/ajiyoshi/20060911 でsetTimeoutの仕様について熱く語られている.私も興味を持ったのでざっと調べてみた. まず超基本的な話としてマルチプロセスなOSにおいて完璧な 時間制御というものは無理ということだ.これは話を極端にして ｢1万個ブラウザ立ち上げてきっちり1msecごとになにかをさせようとしたらちゃん
JSONとContent-Type サーバサイドからJSONを吐き出すときのContent-Typeなのですが、各ブラウザによって対応がちょっと違います。 下の表にまとめてみました。 ×のところはeval中にエラーがでます。 Content-type WinIE Firefox Safari Opera(8.5) text/javascript ○ ○ △ × text/javascript; charset=utf-8 ○ ○ ○ × text/javascript; charset=utf8(utf-8の間違い) × ○ ○ × text/javascript+json ○ ○ △ × text/javascript+json; charset=utf-8 ○ ○ ○ × text/html; charset=utf-8 ○ Safariでマルチバイトな文字を含む場合は、「charse
Though many people still find this page useful, there have been some changes in the browsers since last update of this page, and I generally consider some information here to be outdated. However, I suggest using MooTools or other general Javascript frameworks that provide portable and maintainable basis for writing Javascript code. Web applications are becoming more and more like “normal” desktop
最近Ajaxが普及してきたので、何かとJavaScriptを利用することが増えてます。 そんな中でマウスホイールを使っていろいろできないかと調べたのですが、 結構情報が少なくて、関数として纏まってるところがなかったので作ってみました。 wheel_roll.js wheel_roll.js 対象ブラウザ：IE6系 Firefox 1.5系 ※windowsでのみ確認 使い方 new WheelRoll(idもしくはelement, マウスホイール回転時に呼ばれる関数名, event); 例） new WheelRoll("abc", "hogehoge"); function hogehoge(rollCount) { ・・・} マウスホイール回転時に関数hogehogeが呼ばれ引数に回転数が取得できます。 サンプルサイト：JavaScript マウスホイールでのイベント処理
実際の例としては「Google マップ」がまさにそうです。マウスのホイール部分を回転させると、地図を拡大縮小できます。 これと同じ仕組みを実装するにはどうすればいいの？というお話。 Mouse wheel programming in JavaScript http://adomas.org/javascript-mouse-wheel/ テストページはこちら、マウスホイールを回転させると表示が変わる http://adomas.org/javascript-mouse-wheel/test.html ほかにもこんなことができます。 JavaScript++かも日記: マウスホイールで拡大縮小 インフォシーク ホームページ作成「マウスホイールで画像を拡大縮小する方法」 せつないぶろぐ : JavaScriptによるマウスホイールのイベント処理 暴満館 >> OperaのJavaScript
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
