まず、iPhoneのSafariでどこでも良いのでページを開いてブックマークしましょう。 そして「How to use Firebug on your iPad and iPhone」に書かれているJavaScriptをコピーします。 javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new%20Image;E[r]('src',I+L);})
Firefoxのみ：ウェブ開発に携わっている方が、何か一つFirefoxアドオンを入れるとしたらまず「Firebug」から入れるべき、というくらい必須アイテムとなっているFirebugアドオンのバージョン1.5がリリースされました。 バグ修正に加えて新機能も搭載（詳しくはリリースノート参照）。 HTML、CSS、JavaScript、コード適正化、スピードの適正化、などウェブサイト関連の作業を行うなら「Firebug」は必須。それほどウェブデザインや開発はやらない、という方でもGreasemonkeyスクリプトなど簡単なスクリプトを書く際にはかなり便利です。「Firebug」については「米ライフハッカー謹製Firefoxアドオンパック6選」中でちょっと触れたのですが、かなり便利なツールなので別の記事として書いてみました(MixTape.meなどのサイトも「Firebug」なしでは出来なかっ
20日(米国時間)、Firebugの最新版であるFirebug 1.5.0がリリースされた。FirebugはFirefoxアドオンのひとつで、閲覧しているWebページのHTMLやCSS・JavaScriptを解析するWebデバッガだ。Firebug 1.5.0ではブレーク機能に関する機能が大幅に追加され、より直感的にデバッグが可能となった。概要やアップグレードの手順については「Firebug 1.5.0、登場」に詳しくまとめられているので併せて参照されたい。 おもな更新点は次のとおり(「Firebug 1.5.0、登場」より引用。詳細はリリースノートを参照)。 機能拡張されこれまででもっとも堅固なインスペクタ機能 新しいデバッグ機能「ブレークオン」の導入 MathMLおよびSVGネームスペースのサポート HTML編集機能の改善 Netパネルのタイミング表示をより正確なものへ改善 XHRにお
Webのバグを燃やしまくるFirebugと、そのアドオン7選：ユカイ、ツーカイ、カイハツ環境！（10）（1/3 ページ） 高度化するWebのデバッグに悩む人、必見！ 近年、Google Chrome、Firefox、Safari、Opera、Internet Explorer（以下、IE）がJavaScriptの実行速度の最速の座を争っていますが、それに伴いJavaScriptによるフレームワークやコンポーネントが多数出現し、Webブラウザのユーザビリティは飛躍的に向上してきました。 一方で、開発者／デザイナにとっては複雑化するWebアプリケーションのデバッグが悩みの種となってきています。そんなときにお勧めなのが、Firefox上で動作するアドオン「Firebug」です。これを利用すれば、デバッグがかなり効率的に行えます。 本稿では、Firefoxのアドオンとして利用するFirebugと、
Firediff is a Firebug extension that tracks changes to a pages DOM and CSS. Change Tracking Firediff implements a change monitor that records all of the changes made by firebug and the application itself to CSS and the DOM. This provides insight into the functionality of the application as well as provide a record of the changes that were required to debug and tweak the page’s display. In addition
Mac OSXで使われているモニタは横長になっている。例えば1280×800といった具合だ。Vaio Type-Pなども相当横長になっている。横長が不便という訳ではなく、表計算やグラフィックスアプリケーションを使っている場合はむしろ便利だ。だが時々持て余してしまうのも事実だ。 Firefoxを横に表示する そして縦が短いために、画面を水平に二分割するアプリケーションを使うと見づらくなってしまう。Firebugもその一つだった。が、これからはWiderbugを使えば良い。 今回紹介するオープンソース・ソフトウェアはWiderbug、Firebugを画面下ではなく画面右に表示するFirefoxアドオンだ。 WiderbugはFirebugを入れ替えるソフトウェアとなっている。現在Firebug 1.3相当のものがリリースされており、Windows/Mac OSX/LinuxのFirefox 3
最終更新日 Wed, 29 Apr 2009 01:29:41 +0900 最後のコメント Sun, 25 Jan 2015 19:08:17 +0900 最後のトラックバック Wed, 11 Mar 2009 15:49:00 +0900 ブックマーク 遅くなりましたが、先日に開催された、Kanasan.JS Greasemonkey チュートリアル読書会のレポートです。 せっかくなので、読書会の内容を元にGreasemonkeyスクリプト作成の「入門」「実践」「Tips」の3本立てでまとめてみたいと思います。 今回の開催はKanasan.JSの主催をkanasanから引き継いで、初めての開催ということもあり、とても緊張しました。 途中までは無難に進んでいたのですが、後半は段取り不足が出てきた感じでした。参加者の方々にはご迷惑をお掛けしました。 Greasemonkey チュートリアル読
これまでは、Ruby on Railsの環境づくりや、既存の表（レガシー表）に対してActiveRecordを使用する方法などを説明してきました。今回は、いよいよRuby on RailsにおけるREST（REpresentational State Transfer）に迫っていきます。Ruby on Rails2.0では、script/generate scaffoldがREST対応になったことや、ActiveResourceの標準搭載、AtomPub対応など、RESTfulサービスの実装が進みました。本稿では、RESTによるデータベース操作を、さまざまな方法で体験してみましょう。 Firebugを利用したデバッグ 本稿はスクリプトの確認にFirebugというFirefoxアドインを使用します。 Firebugを利用するにはFirefoxが必要です。お持ちでない方は、以下のURLより事前
Firebugで探索アルゴリズムを見ていこう：コーディングに役立つ！ アルゴリズムの基本（6）（1/4 ページ） プログラマたるものアルゴリズムとデータ構造は知っていて当然の知識です。しかし、教科書的な知識しか知らなくて、実践的なプログラミングに役立てることができるでしょうか（編集部） 今回紹介するのは探索のアルゴリズムです。探索もアルゴリズムのテーマとしてはメジャーなもので、とても重要な用語や考え方が出てきます。 あるデータの集合があったとします。それぞれのデータには、個々を識別するためのIDが付いています。このIDをキーと呼びます。このキーに対応するデータを探すのが探索です。 データベースを知っている方なら主キーで検索する動作だと思ってください。例えば、商品のリストがあり、それぞれの商品に商品コードが付いています。商品コード「7100」に対応する商品データ「トマト」を検索するプログラム
While developing websites is nice to have at hand the right tools to do the job effectively. One of the tools I like the most is Firebug for all it’s debugging capabilities. Also, because I develop websites using symfony, the web debug toolbar provided by the framework is very handy to know what was happening in the server while the request was processed. But sometimes the toolbar position makes i
随時更新 公式ドキュメント Firebug Console API http://getfirebug.com/commandline.html 気になったところ $$(selector) 複雑なCSSセレクタでなければjQueryの$関数の変わりとして使える感じ。 dirxml(node) outerHTML相当のHTMLを出してくれる感じ $$(selector)と組み合わせると便利そう。 inspect(object[, tabName]) 指定したオブジェクトを指定したタブで表示できる。特定要素をHTMLタブで表示させる時、「inspect($$('table#some-id td')[0],'html');」みたいにできる。今まで、「console.log($$('table#tab td')[0]);」を実行してconsoleタブに表示させた後、そこをクリックみたいにやっていた
Webアプリケーションを開発する上で、Firebugが欠かせない。これがないとJavaScriptの開発が相当手間取っていたに違いない。インストールしていると重たくなると言われているが、それでも外すことが出来ないほど便利だ。 そう考えると他の開発環境でも同様の仕組みが欲しくなるだろう。Flexで開発を行う方は、こちらを使ってみよう。 今回紹介するオープンソース・ソフトウェアはFlexSpy、Flex版Firebugを目指す開発補助ツールだ。 FlexSpyはFlexアプリケーションに組み込んで使う。起動すると、Flexアプリケーション内で使われているコンポーネントが一覧表示される。そこで各コンポーネントのプロパティや値を監視することができる。また、その値を変えれば、リアルタイムに描画が変化する。 また、「Find Component」を使うと、カーソルをドラッグアンドドロップしたコンポーネ
WEB開発に活用できるIE版のFireBug「DebugBar 5.0 beta」を試してみました 2007年11月15日- My DebugBar | ToDo / Beta This new version introduces a new DOM tab with greatly improved features on the css side and is fully unicode ! WEB開発に活用できるIE版のFireBug「DebugBar 5.0 beta」を試してみました。 DebugBar をインストールすると、DebugBarツールバーとDebugBarエクスプローラーバーがインストールされます。 DebugBarツールバーでは次のことが出来ます。 ブラウザ画面のキャプチャをメール送信 カラーピッカー 特定の画面解像度にリサイズする機能 ページの表示を 10%
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
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
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
デベロッパがFirefoxを使う理由はエクステンション! Ajax Webアプリケーションの開発者には、WebブラウザとしてFirefoxを愛用しているユーザが多い。その理由のひとつに豊富なエクステンション機能が挙げられる。Firefoxを使っているからエクステンションを使っているというよりも、エクステンションを使いたいからFirefoxを使っているという感じだ。 デベロッパに人気のあるエクステンションはいくつもあるが、代表的なところではAll-in-One GesturesやDictionarySearch、Greasemonkey、User Agent Switcher、ScrapBookなどを挙げることができる。そしてAjax Webアプリケーションの開発において必須ともいえるエクステンションに、Firebugがある。 Firebugに対する称賛の声は枚挙にいとまがない。「Fireb
FirePHP - Firefox Extension for PHP Development FirePHP allows you to take a deeper look at all the work your PHP code does to generate that page you are currently looking at in your Firefox browser. FireFoxでのPHP開発を手助けする「FirePHP」。 FireFoxのエクステンションとして動作し、FireBugの機能拡張をしてくれます。 インストールするとFireBug内に次のタブが表示されます。 サーバヘッダーで特定の文字列を返すとFireBug内、FirePHPウィンドウにその文字列が表示できます。 特定ヘッダーを出力するために、「FirePHP PEAR Package」が使え
Firebug - Web Development Evolved 便利すぎて困る程のFireBug1.0系を使ってみよう、ということで、広く使われているであろう0.4系と変わった点をプレビュー。 Googleなどの検索エンジンで、addons.mozilla.org にUPされている0.4系が上に表示されているため、まだ1.0系を使っていない人も多いのではないでしょうか？(という私もそうでした) FireBug1.0系のインストール方法の紹介〜その追加された強力すぎる機能について見ていきましょう。 FireBug1.0系インストール http://www.getfirebug.com/ にてFireBug1.0系のインストール。 FireFox - DOMインスペクタのインストール FireFoxインストール時にDOMインスペクタが入っていない場合は、FireBug1.0系の機能を最大限
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く