最速インターフェース研究会 :: [Ajax] location.hashを使ったセッション復元
最近になってようやくJavaScript関係、動的ロードを使ったテクニック等について 話せる相手ができまして、、なかなか充実しています。 Gmail、GoogleMapsのような画面遷移なしの高速なナビゲーションが注目されています。 サイトが特定のタスクに対して特化している場合、JavaScriptを使ったインターフェースの最適化が非常に有用であるのは間違いありません。 ブラウザ上で動作するリッチクライアントとしてはFlashが圧倒的に有名ですが、Flashは、ブックマーク、ブラウザの戻る進む機能、文字の拡大縮小、などのブラウザが本来備えている機能が使えないため、ユーザビリティ研究者の間では嫌われ者です。 http://d.hatena.ne.jp/nazoking/20050226 というわけで、AjaxがFlashのような使い方をされないような実装例を考えてみたいと思います。 一つは、
クロスブラウザでのJavaScriptキーボードイベントの扱い方:phpspot開発日誌
JavaScriptでのキーボードイベントの処理はブラウザによって違っていて、クロスブラウザで動作させるためには、それぞれのブラウザに合ったコードを実行し分ける必要があります。 JavaScriptでキーボードイベントを取得し、どのキーコードが押されたかを判別するサンプルを以下に示します。CtrlキーやShiftキーが押されたかどうかなどのチェック方法も併せて示しています。 このサンプルを活用することで、Webアプリケーションにショートカット機能をつけ、より使い勝手のよいWebアプリケーションを作成する手助けになるはずです。 以下、サンプル。 <html> <title>クロスブラウザでキーボードイベントを処理する方法</title> <!-- js コード --> <script type="text/javascript"> document.onkeydown = function(
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
JavaScript雑記帳
JavaScript雑記帳 JavaScriptを勉強していて思ったことなどを書いています。 onloadと関数の呼び出しについて イベントハンドラを関数名の位置に書く ブラウザ判別について 論理積と論理和で代入する値を選択する this値について 二重論理否定 HOME
JavaScriptで配列をシャッフル
配列をシャッフル、つまりランダムに要素の位置を入れ替えるというのを、sortメソッドを使ってやってみたのだけど、明らかにダメダメなものになってしまった。その後、あーでもないこーでもないと考えたのだけど、算数が得意すぎて頭が痛くなった。ということを某所でぼやいたらはてのくんがコードを見つけてくれた。どうやらFisher-Yatesという有名なアルゴリズムでやると良いらしい。 最初に書いたコードは、 var a = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9); a.sort( function (a, b) { return Math.ceil(Math.random() * 3) - 2; } ); というもの。sortメソッドは、パラメータに与えられた関数が負の値・0・正の値を返すことによって要素の順序を決定するので、その関数がランダムに値を返せばランダ
最速インターフェース研究会 :: 実践JavaScriptで配列をシャッフルする方法リファクタリング
JavaScriptで配列をシャッフルする話を見て、そういえばArray#shuffleは以前書いた記憶があるなーと思って調べてみたらコピペだった。 http://www.fumiononaka.com/TechNotes/Flash/FN0212002.html Fisher-Yatesというアルゴリズムだそうです。 Array.prototype.shuffle = function() { var i = this.length; while(i){ var j = Math.floor(Math.random()*i); var t = this[--i]; this[i] = this[j]; this[j] = t; } return this; } a = [1,2,3,4,5]; a.shuffle() // 3,1,5,2,4 a // 3,1,5,2,4 ごく普通に実装
javascript - シャッフルシャッフル : 404 Blog Not Found
2006年08月30日18:30 カテゴリLightweight Languages javascript - シャッフルシャッフル なるほど。Schwartzian Transformの意外な利用法だなあ。 snippets from shinichitomita’s journal - JavaScriptの配列をsort関数でシャッフルする Array.prototype.shuffle = function() { return this.map(function(a){ return { weight: Math.random(), value: a } }) .sort(function(a, b){ return a.weight - b.weight }) .map(function(a){ return a.value }); } でも、実践ではどうだろう。調べてみた。
JavaScriptの配列をsort関数でシャッフルする - snippets from shinichitomita’s journal
あえてsort関数を使う方法でシャッフルしてみる。比較関数自体がランダムな値を返す場合と違って、これなら偏らない。 Array.prototype.shuffle = function() { return this.map(function(a){ return { weight: Math.random(), value: a } }) .sort(function(a, b){ return a.weight - b.weight }) .map(function(a){ return a.value }); }とりあえずFirefox1.5でOK。IEでもmap関数を自分で定義してやれば大丈夫のはず。 置換によるシャッフルと違って、weight値のところを適当に変化させれば、要素ごとに重みづけてのシャッフルもできると思う。たとえばよく聞く曲は優先的に前の方に持ってくるとか、その逆と
最速インターフェース研究会 :: ページレンダリングを妨げないdocument.writeの実装
とてもシンプルに自分自身が属する script 要素を取得 http://d.hatena.ne.jp/amachang/20061201/1164986067 document.writeをDOM仕様にする http://nyarla.net/blog/javascript-tips1 あたりに着想を受けて、作ってみました。 http://la.ma.la/misc/js/lazy_writer/ 特定のscript src内のdocument.writeをピンポイントに置き換えることができます。 制限事項としては、document.writeを使ってscriptタグを生成するようなコードの場合、IEではinnerHTMLにscriptを書いても実行されないという仕様があるので実行されません。その点を除けば、IFRAMEをdocument.writeで挿入するような、良くある広告系のdo
ウノウラボ Unoh Labs: Web2.0時代のJavaScriptで注意することを5つほげほげ
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
Firebug Lite をブックマークレット化しました - WebOS Goodies
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 ご存知の方も多いかと思いますが、先日 Firefox 用 Web 開発ツールの代表格 Firebug の 1.0beta がリリースされました。それはそれで嬉しいニュースですが、さらに素晴らしいことに機能限定（というかログ表示とコンソールのみ ＾＾；）ながら Firefox 以外のブラウザーでも動作する Firebug Lite も同時に公開されました。 Oper
sIFR でアンチエイリアス フォントの埋め込み - 我的春秋
sIFR とは？ sIFRは、Flash に埋め込んだフォントのアウトラインと JavaScript を利用して、制作者のお好みのタイプフェイスでテキストを表示する仕組みです。 僕がこれまでいた大学の世界ででも、アクセシビリティ確保＋セマンティックマークアップと、見栄え重視という２つのトレードオフに関する対立はしばしばありました。その、ひとつの歩み寄り策として、目下、制作している新しいブログで、sIFRという仕組みを導入してみることにしました。 sIFR の入手先 sIFR 2.0: Rich Accessible Typography for the Masses sIFR Documentation & FAQ サンプルと HTML ソース sIFR サンプル サンプルで示したように、ASCII 文字だけでなく、日本語や中国語といったマルチバイト文字も扱うことができます。 sIFR 導
Firebug Lite
Thank you, Firebug. You made the web amazing for all! The story of Firefox and Firebug are synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered the Web 2.0 era. Today, the work pioneered by the Firebug community through the last 12 years lives on in Firefox Developer Tools. Switch to the latest version of
JavaScript でのたらいまわしいろいろ: Days on the Moon
「IT戦記 - JavaScript で遅延評価」より。遅延評価といえばたらいまわし関数と相場が決まっている、ような気がする。 function tak(x, y, z) { return (x <= y) ? y : tak(tak(x - 1, y, z), tak(y - 1, z, x), tak(z - 1, x, y)); } これを元記事に従って書き直すとこうなる。 // from http://d.hatena.ne.jp/amachang/20061204/1165180769 Function.prototype.lazy = function () { return { valueOf: this }; }; function takL(x, y, z) { return (x <= y) ? y : takL(takL(x - 1, y, z), takL(y -
IFRAMEを使って非同期にファイルをアップロードするサンプル - PHPプロ！ニュース
平素より「PHPプロ！」をご愛顧いただき、誠にありがとうございます。 2006年より運営してまいりました「PHPプロ！」ですが、サービスの利用状況を鑑みまして、2018年9月25日（火曜日）をもちましてサービスを終了させていただくことになりました。 サービス終了に伴いまして、2018年8月28日（火曜日）を持ちまして、新規会員登録ならびにQ&A掲示板への新たな質問、回答の投稿を停止させていただきます。 なお、ご登録いただいた皆様の個人情報につきましては、サービス終了後、弊社が責任をもって消去いたします。 これまで多くの皆様にご利用をいただきまして、誠にありがとうございました。 サービス終了に伴い、皆様にはご不便をおかけいたしますこと、心よりお詫び申し上げます。 本件に関するお問い合わせはこちらよりお願いいたします。
JavaScript で遅延評価 - IT戦記
ぶっちゃけ 僕は遅延評価のことたぶんあんまり理解してないと思います。 でも、とりあえずこんなの作ってみた function l(a) { return typeof a == 'function' ? a() : a } // lazy の l こうやって使う function add(i, j) { return l(i) + l(j) } var count = 0; alert(add(1, 1)); // 2 alert(add(1, function(){ return 1 })); // 2 alert(add(1, function(){ return count++ })); // 1 alert(add(1, function(){ return count++ })); // 2 alert(add(1, function(){ return count++ }));
JavaScript で文字をトリミングする
JavaScript を用いてエントリータイトル等の文字をトリミング（指定した文字数だけ表示する）するカスタマイズです。 以前、「Movable Type のようなトリミングを、他のブログで実現できないでしょうか」というご質問の回答です。大変遅くなりましたが、このエントリーで回答に替えさせて頂きます。 ここでは文字数でトリミングする方法を紹介していますが、半角・全角が混在している場合のサイズを調整したい場合は、下記のエントリーを参照ください。 JavaScript で文字をトリミングする（改善版） とりあえず「id 属性名」と「要素名+ class 属性名」で指定したタグの中に記述された文字列をトリミングする、簡単な JavaScript を書いてみました。 Windows + IE6/Firefox 2 で実験した限りでは、全角・半角いずれも1文字で計算してトリミングしてくれるようですが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sedition·com is under the knife
配列をシャッフルする
一撃必殺JavaScript日本語リファレンス