タグ

ブックマーク / amachang.hatenablog.com (26)

  • それすぐ実行!JavaScript! - IT戦記

    思った JavaScript はすぐに実行してみましょう! ブラウザの URL 入力欄に javascript:(function() { /*実行したいコードを書く*/ })()FireBug を使ってる人は、コンソール開いて実行したいコードを書く。 たとえばこんなことができます。 これらの例は僕が日頃使っているものです。 グローバルで使える関数を列挙する(Firefox Only) FireBug用 for(var n in window) if(typeof window[n]=='function')console.log(n); URL用 javascript:(function(){var b='';for(var n in window)if(typeof window[n]=='function')b+=n+"\n";alert(b)})() Object.prototyp

    それすぐ実行!JavaScript! - IT戦記
  • style.cssText の使い処に関する考察 - IT戦記

    cssText って知ってますか? cssText っていいうのは CSSRule オブジェクトとか CSSStyleDeclaration が持っている情報を css ファイルに書く形式の文字列にしてくれる機能です。 乱暴に言ってしまえば、 css 系のオブジェクトが持っている innerHTML みたいなものです。 具体例を見てみましょう。 こんな感じの body があるときに <body style="margin: 1em; padding: 1em; border: 1em">....</body> こんな感じで使えます。 alert(document.body.style.cssText); // 'margin: 1em; padding: 1em; border: 1em' 簡単でしょう?(ボブ略 設定も出来ますよ こんな感じ // さっきの続き document.body

    style.cssText の使い処に関する考察 - IT戦記
  • document.createStyleSheet で動的に CSS を生成 - IT戦記

    今まで var element = document.createElement('style'); document.getElementsByTagName('head')[0].appendChild(element); if (ie) { var sheet = element.styleSheet; } else { var sheet = element.sheet; } みたいにやっていた。 ところが dojo のソースを眺めていたら IE には createStyleSheet という関数があるみたい。 createStyleSheet を使うとこうなる。 if (ie) { var sheet = document.createStyleSheet(); } else { var element = document.createElement('style'); doc

    document.createStyleSheet で動的に CSS を生成 - IT戦記
  • IE 以外の JavaScript で getter setter が使えるようになる! - IT戦記

    Opera 9.5 では getter setter が使えるようになります。 http://my.opera.com/desktopteam/blog/kestrel-is-coming で Safari 3 でも使えるか試してみたら・・・ alert({ get x() { return 'ok' } }.x); // ok つ、使えた! Firefox でも かなり前から getter setter が使える という事は・・・ IE 以外で getter setter が使えるのはもうすぐだ!!! IE にしかないプロパティを他のブラウザで実装することができるようになる!! たとえば、こんな感じ? // ↓条件付きコンパイル /*@cc_on @if (@_jscript) @else @*/ if (!('returnValue' in Event.prototype)) { Ev

    IE 以外の JavaScript で getter setter が使えるようになる! - IT戦記
  • (function(){})() の代わりに - IT戦記

    jQuery 見てたら (function() { // hoge })(); を new function() { // hoge }; って書いてたー。おー。たしかにー。

    (function(){})() の代わりに - IT戦記
  • IT戦記 - Safari 3 に実装された、当たっている CSS ルールを全て抽出できる getMatchedCSSRules が凄い

    今日は、まだまだ Safari 3 が熱い! window オブジェクトを走査していたら、またしても面白そうな関数を見つけてしまった。 その名も getMatchedCSSRules !!! まずはデモをご覧ください 以下のブックマークレットを任意のサイトで実行すると、コンテンツの下に DOM Inspector のような要素が出現します。 そこで、要素を開いていくと Safari の場合は、どの CSS ルールが当たっているかを見る事ができます。 javascript:(function(){var d=document,s=d.createElement('script');s.className='css-inspector-script';d.body.appendChild(s);s.src='http://amachang.art-code.org/cssInspector.j

    IT戦記 - Safari 3 に実装された、当たっている CSS ルールを全て抽出できる getMatchedCSSRules が凄い
  • Windows 版 Safari で JavaScript Console を表示する方法 - IT戦記

    ちなみに Mac OSX 版では ~/Library/Preferences/com.apple.Safari.plist に IncludeDebugMenu を 1 として追加すれば Debug メニューが表示されます。 $ defaults write com.apple.Safari IncludeDebugMenu 1 なので Windows 版でも同じだろうと思って C:\Program Files\Safari\Safari.resources\Defaults.plistをエディタで開いてみると XML だったので <key>IncludeDebugMenu</key><true/> や <key>IncludeDebugMenu</key><integer>1</integer> や <key>IncludeDebugMenu</key><string>1</string

    Windows 版 Safari で JavaScript Console を表示する方法 - IT戦記
  • getComputedStyle について調べてたら深みにハマったのでメモ - IT戦記

    getComputedStyle とは!? ある要素にどんなスタイルが当たっているかを計算してくれる。便利な関数。 使いかたはめっちゃ簡単! var style = getComputedStyle(element, ''); alert(style.fontSize); // 14px alert(style.color); // rgb(0, 0, 0) ちなみに第二引数は疑似要素の style を取りたい場合に使います。通常は空文字列でいい。 でも、 getComputedStyle はこのままでは IE, Safari では動かない。 Safari では window(グローバル領域) に getComputedStyle は定義されてなくて、 document.defaultView だけに getComputedStyle が定義されている。 ちなみに、 Firefox, Op

    getComputedStyle について調べてたら深みにハマったのでメモ - IT戦記
  • 5/19 日に行った勉強会の動画をニコニコ動画にアップしました。 - IT戦記

    このエントリーの動画です。 http://d.hatena.ne.jp/amachang/20070519/1179592450 最初にお詫び テープが切れてしまって、僕と fladdict さんと taka:nium さんの動画が録れてませんでした><ごめんなさい!ほんとにごめんなさい! お礼 動画は http://miniturbo.org/ の kz 君が編集&アップしてくれました。相当時間がかかったみたい><ありがとう!ほんとにありがとう!今度なんか奢ります。 動画一覧 haXe remoting でチャチャッとチャット - tocy.Net http://www.nicovideo.jp/watch/sm365442 ActionScriptでサーバーとごにょごにょ - ll_koba_ll http://www.nicovideo.jp/watch/sm365636 RIAと呼

    5/19 日に行った勉強会の動画をニコニコ動画にアップしました。 - IT戦記
  • 昨日のエントリ「document.title の罠」の間違いのお詫び & 補足 - IT戦記

    昨日の「document.title の罠」としたエントリですが document.title の罠 - IT戦記 一部間違いがありましたので訂正とお詫びです。 そのエントリでは、例を <div id="title"></div>としていましたが、 div 要素では発生しませんでした。 ちょっと僕が仕様を捉え違えていたようで、 img, applet, object, embed 以外のタグでは発生しないようです。 混乱させた方、申し訳ありませんでした。 nsHTMLDocument のソースにもろに書いてあるようです。 embed, img, object, applet で再現できました。div などでは無理なようです。 http://lxr.mozilla.org/seamonkey/source/content/html/document/src/nsHTMLDocument.cp

    昨日のエントリ「document.title の罠」の間違いのお詫び & 補足 - IT戦記
    teru_while
    teru_while 2007/05/27
    img, applet, object, embedタグでid="title"とかやるとdocument.titleがおかしくなる。
  • JavaScript の関数を「引数そのまま返す化」

    関数を「引数そのまま返す化」 // sonomama の s Function.prototype.s = function(arg) this(arg); // 来の処理 return arg; // そのまま返す } 例1 hoge.method(); // ← この hoge を調べたい alertだけ alert(hoge); hoge.method(); 改行めんどいー。 console.logだけ console.log(hoge); hoge.method(); 改行めんどいー。 alert + そのまま返す化 alert.s(hoge).method(); // 1 ステートのまま console.log + そのまま返す化 console.log.s(hoge).method(); // 1 ステートのまま 例2 function hoge() { // ...略...

    JavaScript の関数を「引数そのまま返す化」
  • 勉強会資料-IT戦記

    勉強会の趣旨 nitoyon さんから amachang への一通のメールから始まりました。 5/16-18にお仕事で東京にいく予定です。 (中略) 19, 20 も予定がないので、なんか面白いネタ(勉強会?)が あれば参加してみたいものです。 というわけで、じゃあ、 nitoyon さんの興味のありそうな分野の人を集めようということで、今回の勉強会が決定しました。 発表と各資料のリンク 随時リンクしていきます。資料を公開したかたはトラックバックやコメントをくれるとうれしいです! tocy – haXe remoting でチャチャッとチャット ll_koba_ll – ActionScriptでサーバーとごにょごにょ(資料) nitoyon – RIAと呼ばれるものまとめ(資料) ZIGOROu – Canvas Mario Bros. cho44 – Ruby, RubyCocoa,

    勉強会資料-IT戦記
  • Livedoor Reader や Livedoor Clip を読んだときに Firebug が壊れる件を修正。 - IT戦記

    今まで LDR や LDC を使うと Firebug が壊れて困ってました>< 原因が分かったので エントリーを書いてみました。 原因は Livedoor Reader や Livedoor Clip が parent という名前のグローバル関数を定義していること。 Firebug が parent を無条件に Window オブジェクトと判断していること。 で、修正方法 まず、 Firefox のプロファイルディレクトリに行く。 環境 プロファイルディレクトリ WinVista C:\Users\[ユーザ名]\AppData\Roaming\Mozilla\Firefox\Profiles\[ランダムな文字].default\ WinXP C:\Users\[ユーザ名]\AppData\Roaming\Mozilla\Firefox\Profiles\[ランダムな文字].default\

    Livedoor Reader や Livedoor Clip を読んだときに Firebug が壊れる件を修正。 - IT戦記
  • IT戦記 - 印刷プレビューで「F5」を押したらリロードできる拡張機能作ったよん。

    印刷用 CSS 書いてますか? Web はユーザが見方を決められる唯一のメディアだと「コクボックルさん」が言っていたので、やっぱり印刷用のスタイルはきっちり書いておいたほうがいいですよ! でも、「書いて確認して、、、めんどくせー!だって、印刷プレビューってリロードできないんだもんよー!」 と某デザイナーさんが言ってた。。 やってみたら、たしかにめんどくせー。 じゃあ、出来るようにしようジャマイカ こんな時間に拡張機能を一つ作ってしまった^^; みなさんも、印刷用 CSS の確認のお供に使ってくらさい。 ダウンロード http://usrb.in/aj/pp-0.1.xpi 使いかた 印刷プレビュー画面で「F5」でリロード。今のところそれ以外の機能は一切ない。 確認機種 Firefox 2.0.0.3 Linux Firefox 2.0.0.3 Windows XP フィードバックくれるとう

    IT戦記 - 印刷プレビューで「F5」を押したらリロードできる拡張機能作ったよん。
  • 完全私的 忘却防止メモ Firefox 上の全ての関数監視 - IT戦記

    with(Components) var jsd = classes['@mozilla.org/js/jsd/debugger-service;1'] .getService(interfaces.jsdIDebuggerService); var store = new なんかストレージっぽいもの; function hook() { jsd.enumerateScripts({enumerateScript: function(s){store.add(s)}}); jsd.scriptHook = { onScriptCreated: function(s) {store.add(s)}, onScriptDestroyed: function(s) {store.remove(s)} }; } jsd.breakpointHook = { onExecute: function(

    完全私的 忘却防止メモ Firefox 上の全ての関数監視 - IT戦記
    teru_while
    teru_while 2007/05/15
    関数のフック。
  • JavaScript で簡単にスタックトレースを取るテクニック

    Firebug を使うと console.trace(); これだけでスタックトレースを取ることが出来ます。 でも、 XUL の開発とか、人のブラウザで Firebug が入ってない時とかは出来ないので、 そういう時は、 alert(Error().stack); これだけで出来ます。まあ Firefox only ですが。

    JavaScript で簡単にスタックトレースを取るテクニック
  • 親友へ。ブログを書こう。 - IT戦記

    はじめに ガイアックスに入社する前からの数少ない親友でプログラマの y が人生の岐路に立っているようなので、エントリーを書いてみることにした。 y とは mixi の足跡がきっかけで知り合って、もうすぐ丸二年の付き合いになる。人生の 10 % の時間をインターネットでつながっていたということになる。 あのときから見たら、自分も y も随分変わったんだろうなあ。普段は考えたりしないけど、しみじみとあのときのことを思い出してみた。 そして、 y にももっと web で色んなものを公開して欲しいなと思った。どんなささいなことでもいい。完成度なんてなくていい。二次情報でもいい。技術のことでなくてもいい。 y へ。そして、ブログを書いたことがないすべての人へ。 ブログを書こう 誤解のないように言っておきますが、書くべき!という感じではなく、イイヨーイイヨー書いたほうがイイヨー的な意味です。 ブログを

    親友へ。ブログを書こう。 - IT戦記
  • Firebug の monitorEvents unmonitorEvents がバグってる件とそのバグ修正方法 - IT戦記

    以下のエントリーを見て FirebugのmonitorEventsが動かない - Enjoy*Study で、実際はどうなんだろうと試してみた。 ちなみに monitorEvents とは Firebug のコンソールで >>> monitorEvents(document.body) と打ち込むと document.body にあがってきた全てのイベントをモニタリングできる >>> monitorEvents(document.body, 'click') と打ち込むと document.body にあがってきたクリックイベントをモニタリングできる >>> monitorEvents($('target')) もちろん document.body 以外もできる そんな機能 たしかに、現在の Firebug 1系 ではこれがバグっててまったく機能してない! なんで今まで気がつかなかったんだ

    Firebug の monitorEvents unmonitorEvents がバグってる件とそのバグ修正方法 - IT戦記
    teru_while
    teru_while 2007/05/12
    最近になってmonitorEventsとか使ってみたけど、超絶便利だった…。
  • IT戦記 - CSS Nite Shuffle に行ってきた

    レポートを端々とまとめますよー 良いところも悪いところも隠さずまとめますよー。 そういえば、こういうレポート書くの始めてだ。 あ、ちなみに Apollo WPF は飲み会で聞いた話がほとんどでつ>< オープニング かっこいい動画。 スペシャルコンテンツ ミニオーケストラ。 20分 エコなWebデザイナーになろう - 長谷川恭久 エコと言っても環境問題の話ではない。 最初は環境問題の話から始まるが、途中でネットが汚染されてるとかって話がすり変わって、 font 要素とか table レイアウトとか SEO スパムとかの話になる。 コードをリサイクルしようといってエディタの機能を紹介 カメレオンアイコン 率直で分かり易い言葉を使おう ブログ書いたり、会話したりして、共有しようぜ どちらかというとオープニングのライトな話って感じ Apollo、インストールから向かうビジョンまで - 太田禎一 太

    IT戦記 - CSS Nite Shuffle に行ってきた
  • 社内の勉強会をやって、一番うれしいこと - IT戦記

    以下のエントリーがすごく嬉しかった id:yupug:20070413:1176472206 今まで社内勉強会を開いてもこういう反応が返ってきたことは無かった。 今までの社内勉強会の反応 勉強会が終わって「どうだった?理解できた?」と聞いたときの反応がほとんど、これ。 「いやー。レベルが高くてついていけなったっす。」 へりくだる必要なんてないんだよ! 勉強会で「レベルが高くて」なんて言われても全然嬉しくないよ。 それなんて日文化?って感じだよ。 理解するための勉強会だよね?別にただの「イベントのり」じゃないよ。 まず、質問してよ! 分からないなら質問して! あとで、僕のところに来て個人的に質問するんじゃなくて。 いや、それならまだマシなほう。 「あ、ここは僕どうせわかんないし」とか思うんじゃなくて。 質問して! みんなの前で質問して! 勉強会は、みんなの「分からない」を共有する場でもある

    社内の勉強会をやって、一番うれしいこと - IT戦記