はじめに JavaScript が書ければ、誰でも簡単に Firefox の拡張が書けてしまう。しかも、もれなく jQuery が付いて来る! というものを Mozilla Labs がリリースしたみたいですね。 https://jetpack.mozillalabs.com/ というわけで 少し触ってみました Jetpack Feature の書き方 Jetpack で書く Firefox 拡張を「Jetpack Feature」といいます。 これは、以下の 2 つのものを用意すれば誰でも簡単に公開することが出来ます。 JavaScript ファイル 公開用 HTML ファイル JavaScript ファイル JavaScript ファイルには、 Jetpack Feature のアプリケーションコードを書きます。 (function() { Jetpack.statusBar.appe
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年にしてみました。 す
こんにちは、『プチペット』を担当している吉沢です。 最近のモバイルサイトはキャリア間や機種に依存する問題が少なくなり、表現の制約も少なくなってグラフィカルに魅せることできるようになってきましたね。 グラフィカルに魅せることができるようになった分、HTMLソースも複雑になり、デザイナーやマックアッパーにコーディングを依頼する機会が増えてきていると思います。 状況は会社によって様々だと思いますが、今回は、効率よくデバックを行って完成度を高めたい、ちょっとした作業はディレクター側で行いたいというときに、PCサイトの作成でもおなじみのツールを含めた、モバイルならではのツールの使い方をご紹介したいと思います。 【1】FireMobileSimulator PCでモバイルの画面を表示することができるので、電波状況や通信速度を気にしなくてもよく、レイアウトのチェックから、機能面のデバックをスピーディに行
FirePHP - Firebug Extension for AJAX Development FirePHPがますます便利になっている件、ということで、以前に紹介したFirePHPですが、色々と更新されているようなのでご紹介。 アイコンも変わってます まず、どういうことが出来るか、という点です。以前紹介した時とやり方が結構改善されているみたい。 <?php FB::log('Log message'); FB::info('Info message'); FB::warn('Warn message'); FB::error('Error message'); ?> と書くと、以下のように表示されます。 firebugのconsole.logみたいに使えます。 PHPのコード内で、1行でかけるのでなかなか便利そうです。 次のように、オブジェクト指向で書くこともできるみたい <?php
快適なWeb開発環境を構築する、Firefoxアドオン10選:エンジニアがお薦めする 現場で使えるツール10選(2)(1/5 ページ) ITエンジニアの方であれば一度は使ってみたことがあるFirefoxだが、いまひとつ使いこなせていない人や標準のInternet Explorer(IE)に戻ってしまった人もたくさんいるだろう。 FirefoxといえばオープンソースのWebブラウザとしてIEをしのぐ勢いでWebブラウザのシェアを獲得してきている。2008年6月には「Firefox 3」になり、レンダリングエンジンも高速化されて注目を集めた。そんなFirefoxの最大の魅力は、何といっても拡張機能である豊富なアドオンが公開されていることだ。 アドオンを組み合わせて自分が使いやすいWebブラウザ環境をつくることができる。これがFirefoxの楽しみ方の1つでもある。しかし実際には、あまりにも多く
SURGAVIP # Link Slot Pragmatic Gacor Malam Ini Modal Kecil Janji Maxwin Sekarang ! Selamat datang di SURGAVIP situs slot terpercaya dari server PG Soft ternama, banyak jenis permainan slot gacor dan mudah menang maxwin disini bersama surgavip. main dengan modal receh pulang dengan uang berlimpah. SURGAVIP dikenal sebagai situs terpercaya dengan koleksi lengkap game dari pg oft, provider yang udah
2008年09月17日 Firefoxで『感動した!』ってアドオン15個 WEBの仕事をしていると、様々なアプリを駆使して作業をこなすという事が多いのですが、わざわざアプリを立ち上げなくてもよい、Firefoxのアドオンがこれだ。 ◆IE Tab ■IE Tab :: Firefox Add-ons もはやIEは確認用でしかない!IEをFirefoxで確認するアドオン ◆Style Sheet Chooser II ■Style Sheet Chooser II :: Firefox Add-ons スタイルシートを切り替える場合に使える。 ◆CSSViewer ■CSSViewer :: Firefox Add-ons マウスオーバで指定した箇所のCSSのパラメータを確認できる。 ◆CSS validator ■CSS validator CSSのW3Cチェック。すんごい厳しいコーディ
★重要★2008/11/15追加:公式サイトFireMobileSimulator.org開設にともない、この記事の更新はストップします。今後のアップデート情報は公式サイトで行いますのでよろしくお願いします。 モバイルサイトをPCで閲覧するために、従来からある方法として、キャリアの提供するシミュレータの使用、Proxyの使用、Firefoxのuseragentswitcher+modify headersの組み合わせ等、色々と手段はありましたが、これらの方法は、それぞれに不足している機能があったり、またITに詳しくない人とかだと導入段階でつまづいてしまったりします。 そこで、もっと簡単にモバイルサイトをPCで見るために便利なツールを作成しました。 Firefoxを簡単に携帯シミュレータにできるアドオンです。モバイル端末のHTTPリクエストや絵文字表示をシミュレートすることができます。3ヶ月
随時更新 公式ドキュメント 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タブに表示させた後、そこをクリックみたいにやっていた
こんにちは。ライブドアでモバイルディレクターをしている河野です。 モバイルディレクターをしていますと、モバイルのサイトをPCで見たいという要望が少なからずあります。それは、PC からの方が実機で見るよりレスポンスが早く、また電波状況に左右されずに閲覧できたり、リンク先の URL の情報やヘッダ情報、画面キャプチャーなど実機からでは得られない情報を取得することができるからです。 そこで今回はモバイルサイトを PC で閲覧する方法についてまとめながら、開発を進めるのに便利なツールや Firefox のアドオンを紹介できればいいなと思います。 Web サーバは一般的に2つの方法でアクセスがモバイルからかどうかを判定します。1つはアクセス元のIP、そしてもう1つは HTTP ヘッダ中にある User-Agent です。そのため、携帯キャリアのゲートウェイ経由からのアクセスのみ閲覧を認めるサイト(つ
Webアプリケーションのテストは面倒くさい。HTTPでゲットするだけであれば良いが、ポストしたり、JavaScriptでレンダリングしてあったりと、動作も複雑だ。それらを全て網羅的にテストするのはなかなか難しい。 自動操作中 そこでテストにブラウザを使ってみよう。自動操作することで、テストの効率化をはかれる。 今回紹介するオープンソース・ソフトウェアはFirewatir、Firefoxを自動操作するソフトウェアだ。 FirewatirはIEをRubyを使って自動操作するソフトウェア、WatirのFirefox板とでも言うべきソフトウェアだ。実際、読み込むファイル等は違えども全体的な操作はWatirと同じスクリプトで動作する。 操作中のターミナル 実際の使い方はFirewatirの提供するXPIをFirefoxにインストールし、JSSHを起動する。そしてGemを使ってFirewatirをイン
端末IDを設定でき、ケータイサイトの開発に便利なFirefoxアドオン「Modify Headers」 Tweet 2008/4/17 木曜日 matsui Posted in ソフト紹介 | 5 Comments » 本日は、ケータイサイトの開発に便利なFirefoxアドオン「Modify Headers」をご紹介します。 ケータイ向け開発を行っていると、ログイン部分のプログラム作成などで、端末IDを取得したいケースがあります。 エミュレータには端末ID出力のための機能がついていたりするのですが、そのためにいちいちエミュレータから操作するのは面倒です。 「Modify Headers」を使うことで、HTTPヘッダを指定の通りに書き換えることができるため、携帯電話になりすまし端末IDを出力することができます。 → FireFox Add-ons Modify Headers [mozill
Firefox拡張機能(extension)の作り方 Firefox拡張機能(extension)の作り方を説明します。 Firefox 拡張機能とは Firefox add-onの一種です。 add-onは次のように分類できます。 plugin ...実体はexeやdll。C++で作成。素人にはお勧めしません 検索バー ...実体はXMLの設定ファイルのみ。見れば分かるので説明はしません スペルチェッカ ...日本語には無縁なので未調査(たぶんファイルを作るだけ) 拡張機能 ...実体はXML、JavaScriptとCSS。必要なら、C++で書くXPCOM。これから説明します テーマ ...拡張機能のサブセット。CSSのみの場合をテーマと呼びます
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く