Firebugの「要素を調査」ボタンを出すと便利！ — ディノオープンラボラトリ
Firefoxのアドオンの中でもFirebugは便利ですよね。無いと死ぬって人も多いかと思います。ところで、このFirebugの機能の中でも「要素を調査」ボタンが便利すぎるのでご紹介します。 ここで言っている「要素を調査」ボタンというのは、下記のキャプチャ画像にある、ナビゲーションツールバーの眼鏡のアイコンのことです。 この眼鏡ボタンを押すとFirebugの「要素を調査」の機能が働きます。要するに、Firebugの「調査」ボタンと同じです。Firebugをインストールしたままの状態だと、ステータスバーのFirebugのアイコンを押してから「調査」を押して、と2回クリックするところが、1回クリックするだけで実行できるというのが違いです。こうして説明すると小さな差ですけど、このおかげで私の「調査」をする頻度が格段に上がった気がします。JavaScriptやCSSを触る人は「調査」する機会が多い
koress.jp: Firebugの虫アイコンを変更する方法
はじめまして。珍しくデザイナーのぼのです。 先月、Firebugのバージョンが新しくなりましたが、 それに伴って、ステータスバーにあったアイコンが ご丁寧にもリアルな（ゴキブリのような）ホタルアイコンになってしまいました。 特に虫嫌いの女子の方は敏感だと思いますが、 いつもウィンドウの右下にたたずんでいるコイツが、気持ち悪くて許せなくてなりません。 しかもコンソールを開くとさらにひとまわりでかいのが、表示されるではありませんか...orz というわけで、このアイコンを簡単に変更する方法をご紹介、 さらに虫の形状は保ちつつも、ちょっとかわいい代替アイコンも自作してみました。 まずは簡単に、アイコンの変更方法から。 Firebugで使われているデフォルトのアイコンを上書きするだけで、変えられます。 アイコンの画像が格納されているパスは（）内が個人によって微妙に違いますが、 階層としてはこんなか
Firebugで作るGreasemonkeyスクリプト〜入門と実践(From Kanasan.JS) | Blog.37to.net
最終更新日 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 チュートリアル読
FireQuery - jQueryを扱う際に便利なFirebug拡張 - - monjudoh’s diary
FireQuery is a Firebug extension for jQuery development jQueryを扱う際に便利なFirebug拡張 現在のバージョンは0.3 結構前に紹介されていたけど、ちゃんと使いこなせてきた感じなので紹介する。 以下、各機能について紹介と解説。 jQueryオブジェクトのconsoleへの表示 jQueryオブジェクトをFirebugのconsoleへの出力 1.2系の場合通常のオブジェクトとして表示されてしまいどの要素を抱えているかぱっと見て把握出来ない、 1.3系の場合は通常の配列と同じように表示される。 jquery12.fn.jquery;// 1.2.6 jquery12('div');// Object length=6 0=div#main 1=div#outer1.outer jquery13.fn.jquery;// 1.3
jQueryを使った開発に便利！Firebug + jQuery·FireQuery MOONGIFT
Firefoxを使ってWebシステムを開発する際には必須とも言えるFirebug。そして人気の高いJavaScriptライブラリのjQuery。この二つが組み合わさったとき、これまで以上の魅力が感じられるようになる。 マウスを当てるとそのエレメントがハイライト表示される そう確信できるのがFireQueryを使った瞬間だ。この二つの融合は、JavaScriptの開発をバーストしてくれるのではないだろうか。 今回紹介するオープンソース・ソフトウェアはFireQuery、Firebugと連携するjQuery開発補助アドオンだ。 FireQueryはconsole.logに吐き出した内容を元に、画面上のエレメントをハイライトしてくれる。例えばconsole.log($('p'));と出せば、コンソールに出力された jQuery(p)という表示にマウスを当てると、該当部分がハイライト表示になる。ど
FirefinderはJavaScriptプログラマ以外も使うべき - monjudoh’s diary
Firefinderとは何か？ https://addons.mozilla.org/en-US/firefox/addon/11905/ CSSセレクタやXPathで要素を検索出来るFirebugの拡張です。 どんな人にお勧めか？ hiddenフィールドの値を閲覧したり、 formのどの要素のnameが何かとかさくっと見たくなることないですか？ あるならお勧めです。 Firebugには既に$$というCSSセレクタで要素を検索出来る関数があるんだが？ CSSセレクタのサポートの度合いが違います。 $$関数では基本的なCSSセレクタしかサポートされていないので、 例えば、ここなら、http://images.google.co.jp/advanced_image_search?hl=ja $$('input'); // [input, input ja, input Google 検索, i
FirebugでXpathやCSSセレクタによってエレメントを高速に検索できるようになる「Firefinder」:phpspot開発日誌
FirebugでXpathやCSSセレクタによってエレメントを高速に検索できるようになる「Firefinder」 2009年05月25日- Firefinder for Firebug :: Firefox Add-ons FirebugでXpathやCSSセレクタによってエレメントを高速に検索できるようになる「Firefinder」。 Firebugの拡張として動作し、インストールすると Firefinder タブが表示されます。 まずは css セレクタによって探してみます。 div.content で検索すると、<div class="content">がマッチします。 divだけで検索するとすべてのdivを探すことが可能です。 XPathｄｅ検索してみたところ、同じように検索が可能 マッチしたエレメントは赤色でハイライト表示されます Firebug標準の検索機能は、1個1個検索して
Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」:phpspot開発日誌
Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」 2009年04月20日- Firediff - In Case of Stairs Ajax開発等に超便利なページ内の変更部分が一発で分かるFirefoxアドオン「Firediff」。 これは欲しかった！という機能がついにリリースされました。 インストールにはFirebug1.4が必要で、Firebug1.4a17以降が推奨されています。 Firebug1.4のダウンロードはこちらから可能です。 まず、インストールすると、次のように、FirebugにChangesタブが表示されます。 で、実際どうやって使えるか？見てみましょう。 (1) DOMインスペクタをいじった結果をDIFF たとえば、DOMインスペクタの中で、要素を編集してみます。 2009年4月16日を2009年にしてみました。 す
秋元@今日も頑張ってます! � YSlowのSteve Souders氏が新測定ツールHammerheadをリリース
米Yahoo!のクライアント側パフォーマンスチューニングで名を上げ、Googleに移籍した、「ハイパフォーマンスWebサイト」の著者スティーブ・サウダーズさんが、新しいプラグインHammerheadを出しました。 Hammerheadは、FirefoxのFireBug拡張の上で動く子拡張。Firebugを入れた上でインストールする必要があります。 Firefox3のアドオンマネージャのセキュリティチェックに引っかかるので、パラメータをいじらないとインストールできません。about:configから手順に沿ってパラメータを一つ追加する必要があります。 ブラウザ側のパフォーマンス測定をするときは、キャッシュの影響を排除しないと正確な測定ができません。このプラグインではまず、ディスクやメモリ上のキャッシュをステータスバーからクリアするための簡易な手順が提供されます。 これは、3つのURLについて
ログをFirebugのコンソールへ出力してみる。 - gounx2の日記
これは何？ 次のようなスクリプトを書いたときに・・・ <?php include_once dirname(__FILE__) . '/__init__.php'; Rhaco::import('LoggerPublisherFirebug'); // 追加してるのはここと。 LoggerPublisherFirebug::initialize(true); // ここだけ。 class Test{ var $v_int = 99; var $v_string = "string"; var $v_array = array(1,2,3); var $v_hash = array("keyA"=>111,"keyB"=>"222"); } $o = new Test(); Logger::info($o); ?> firebugのコンソールタブに以下が出力されます。 文字列以外（オブジェク
ウェブ制作にかかせないFirebugの機能を更に強化する機能拡張集 | コリス
Sofrware is hardのエントリーから、豊富な開発ツールを備えたFirefoxのアドオン「Firebug」の機能を強化する機能拡張を紹介します。 List of Firebug Extensions Firebug HTML, CSS, JavaScriptなどを編集・デバッグ・モニタリングできる開発ツール。 以下の全ての機能拡張は、Firebug上で動作します。 Firebug Firebug -Firefox Add-ons YSlow ページの分析、パフォーマンスレポート、HTTP/HTMLサマリー、コンポーネントのリスト YSlow YSlow -Firefox Add-ons Firecookie クッキーの管理 Firecookie Firecookie -Firefox Add-ons FirePHP PHPのデバッグ FirePHP FirePHP -Firefo
norah# : Firebug日本語版
norah'# - "You do your job. If you get results and people thank you for it, so much the better" norahmodel.exblog.jp ブログトップ 開発版 Firebug 1.6.0.20100126 - ダウンロード 更新履歴 :: ChangeLog 2010/01/26: Firebug 1.6.0.20100126 Dev Edition Release 2009/07/22: Firebug 1.4.0 Release 2009/05/23: Firebug 1.4.0.20090523 Dev Edition Release 2009/05/06: Firebug 1.4.0.20090506 Dev Edition Release 2009/04/08: Firebug 1.4
JavaScriptをFirebugでデバッグする方法。
今回は作成した Ajax プログラムを Firebug でデバッグしてみます。 プログラムの誤りをバグ(bug 小さな虫)といい、バグを探して取り除く作業をデバッグといいます。またデバッグを支援するソフトをデバッガといいます。 Firebug は高機能な JavaScript デバッガを備えているので、プログラムを一時停止したり、1行ずつ進めたり、変数の値を確認することができます。 プログラムは人間が作るものですから、必ずバグが入り込みます。作ったプログラムが1回目で動くことはほとんどありません。プログラムが上手く動かないときは焦らずに、デバッガを使い原因を見つけて、一つずつ解決していきましょう。 今回は動作確認済みのプログラムを使いますのでエラーは出ません。とりあえず Firebug の使い方に慣れることに専念してください。 ・Firefox をインストールしていない方は、「Step3・
いまさら人に聞けない Firebug tips - bits and bytes
2年前の夏に書かれたFirebugの便利な組み込み関数 - 技術メモ帳を読んで、いまさらdebuggerと書くとそこからデバッガでステップ実行できるのを知ってショックでした.... lurkerさんのブログで紹介されている$0, $1 で直前にinspectしたものを参照できることも、なぜか公式のドキュメントっぽいFirebug Documentationには載っていなくて、FireBug Documentation - JoeHewitt.comには載っています。 で、もうひとつ、ソースコードにしか書かれてなさそうなやつを発見しました。$$1と$$2です。 自分はFirebugを使っていて、ときどきconsole.logで出したオブジェクトのプロパティを引数にして関数を呼んだりしたい、ということがあったけどできなくて困ってたんですが$$1でそういうことができるようになりました。 たとえば
MOONGIFT: » Flex向けFirebug「FlexSpy」:オープンソースを毎日紹介
Webアプリケーションを開発する上で、Firebugが欠かせない。これがないとJavaScriptの開発が相当手間取っていたに違いない。インストールしていると重たくなると言われているが、それでも外すことが出来ないほど便利だ。 そう考えると他の開発環境でも同様の仕組みが欲しくなるだろう。Flexで開発を行う方は、こちらを使ってみよう。 今回紹介するオープンソース・ソフトウェアはFlexSpy、Flex版Firebugを目指す開発補助ツールだ。 FlexSpyはFlexアプリケーションに組み込んで使う。起動すると、Flexアプリケーション内で使われているコンポーネントが一覧表示される。そこで各コンポーネントのプロパティや値を監視することができる。また、その値を変えれば、リアルタイムに描画が変化する。 また、「Find Component」を使うと、カーソルをドラッグアンドドロップしたコンポーネ
FirefoxをSEO好きやWeb制作者向けにカスタマイズする為のアドオン8選＋α | パシのSEOブログ
SEOやWeb制作を行う上で、サイトの分析やチェックが必要になる事も多いと思いますが、作業効率を上げる為にFirefoxをまっさらな状態から完全なSEO・Web制作仕様にカスタマイズする方法をご紹介します。カスタマイズと言ってもアドオンをインストールするだけですので、誰にでも簡単にできます。 SEO関連 SEO for FireFox ダウンロード Googleの検索結果にSEOに役立ちそうな情報を表示する事ができます。また、nofollowリンクを視覚的に分かりやすくする機能もついています。 利用する為には無料ユーザ登録が必要です。メールアドレスとユーザーネームを登録し、送られてきたメールに記載のパスワードでログインし、さきほどのダウンロード画面からインストールできます。 「ツール ⇒ SEO for Firefox ⇒ Option」で表示したくない項目は消すことが出来ます。Autom
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IBM Developer
TechCrunch | Startup and Technology News
madison-ralg-kxED2shuUg-unsplash-scaled
404 Not Found