【ハウツー】Webデバッガに新星登場!? 操作を記録し、イベント/DOMを一発解析 - FireCrystal (1) FireCrystalとは | エンタープライズ | マイコミジャーナル
複雑な機能をいくつも実装したWebアプリケーションのデバッグはツールなしでは一苦労だ。Ajax処理やこまかいイベント制御・DOM操作をおこなっている箇所でバグを出してしまった日には、解析だけで大変な時間を割かなければならない。 そんなときは、FireCrystalを使えば解決するかもしれない。ユーザの操作を記録し「どのタイミングで」「なにがおこなわれているか」を一発で表示してくれる便利なアドオンだ。 本稿では、そのFireCrystalについて紹介しよう。 FireCrystalとは Stephen Oney氏は8月21日(米国時間)、Firefox上で動作するアドオン「FireCrystal」をリリースした。FireCrystalはThe MIT Licenseのもとで公開されている、Webデザイナ・デベロッパ向けのデバッガ。Webページ上でユーザの操作を記録し、内部でどのようなイベント
JSONファイルをFirefox上で閲覧する·JSONView MOONGIFT
Webアプリケーションが増えるに従って、JSONフォーマットを利用する機会も増えてきた。だがJSONファイルの扱いはそれほど良くなく、Firefoxの場合ダウンロードのダイアログが開いてしまう。それにシステム向けに改行なしで作られているケースが多く閲覧には不向きだ。 JSONフォーマットをFirefox上で閲覧できる 今後さらに利用が進んでいくと思われるだけに、扱い勝手が悪いのは問題だ。そこで使ってみたいのがJSONViewだ。 今回紹介するオープンソース・ソフトウェアはJSONView、Firefox上でJSONファイルを閲覧できるようにするFirefoxアドオンだ。 JSONViewをインストールした状態でJSONファイルを開くとダウンロードダイアログが開かず、そのままソースが見られるようになる。キー、文字列、数値とそれぞれハイライト化されて表示されるので分かりやすい。配列やハッシュの
AutoPagerizeをサーバーサイドから配布する - てきとうらいふ
こんにちは、フリーランスのビール係、kimzoです。 最近はDDDを実践する毎日で、飲んでから書くコードがカオスで楽しいですね。なんじゃこりゃー！って遊べる。 AutoPagerizeは素敵だけど ところで、AutoPagerizeという便利なUserscriptがありまして、googleだろうとtwitterだろうと、「次へ」ボタンを押す必要なくスクロールで先読みしてくれるナイスガイで快適ネット廃人ライフの強い見方なのです。 ですが、このネットサーフィンラクチンツールはgreasemonkeyというのを入れたブラウザー上で、ユーザーがスクリプトを読み込んで初めて機能するのですが、当然、世の中はそんなの入れる変態さんばかりじゃないのです。 なので、このナイスガイのナイスな機能の恩恵に預かれるのはたった一部の変態さんに限られてて、それはもったいないなーと思ってました。 サーバー側で配布しちゃ
【ハウツー】FirebugにHTML/CSSリファレンスをアドオン! - FireScope (1) あのプロパティの使い方なんだっけ? これからはFireScopeで一発! | エンタープライズ | マイコミジャーナル
あのプロパティの使い方なんだっけ? これからはFireScopeで一発! SitePoint.comは1月27日(米国時間)、Firebug上で動作するアドオン「FireScope v1.0.1」をリリースした。FireScopeはFirefox2-3のFirebug1.2以降で動作するアドオン。各種HTMLエレメントやCSSプロパティといった要素のリファレンスと各種ブラウザの対応状況、サンプルコードを表示してくれるアドオンだ。SitePointが公開している各種HTML, CSSリファレンスの一部をまとめた内容となっている。 主な機能は次のとおり。 HTML Elements Reference HTML Attributes Reference CSS Properties Reference サンプルコード リファレンス内検索 W3C勧告に準拠しているかどうか 各種ブラウザ対応状況(
Medium
You can find (just about) anything on Medium — apparently even a page that doesn’t exist. Maybe these stories will take you somewhere new?
エロ動画サイト閲覧を超高速化するブックマークレット
2008-10-06追記：リンク一つ毎に改行タグ(br)を入れる部分のコードが消えていたので引用記法からpre記法に変更しました。 XPathの練習として作ってみました。 yourfilehostへのリンク以外を抹殺します。yourfilehostへのリンク以外は全て騙しリンクというページで使います。 ページの読み込みが完了する前に実行できるので、騙しリンクや画像の描写に無駄なCPU時間を使わなくて済むという地球に優しい仕様となっております（グリーンIT）。 Firefox 3とGoogle Chromeで動作確認しました。 コード javascript:(function(){document.body.style.display='none';var a='//body/*';var b=document.evaluate(a,document,null,7,null);for(var
クリックジャッキング：研究者が複数のブラウザに対する新たな脅威について警告
文：Ryan Naraine（Special to ZDNet.com） 翻訳校正：石橋啓一郎 2008-09-27 10:55 セキュリティ研究者が、すべての主要なデスクトッププラットフォームに影響のある、新たな恐ろしいブラウザに対する脅威に対する警告を発している。その対象となるのは、Microsoft Internet Explorer、Mozilla Firefox、Apple Safari、Opera、そしてAdobe Flashだ。 この脅威は「クリックジャッキング」と呼ばれるもので、OWASP NYC AppSec 2008カンファレンスで議論されるはずだったものだが、Adobeやその他の影響を受けるベンダーの要望で、包括的な修正が準備されるまではこの話題を公にすることが取りやめられていたものだ。 これを発見したのは、Robert Hansen氏とJeremiah Grossm
IE6にPNG画像のアルファチャンネルを効かせる方法のまとめ | Blog hamashun.com
最近はアルファチャンネルを含むPNG画像を利用したサイトが増えてきたように感じます。 2008年9月号のWeb Designing誌でも特集が組まれたりと、関心も高まっているようです。 ただ、そこで問題となるのはIE6のアルファチャンネル問題。 何らかの手段でこれを解決する必要があります。 少し前の仕事でこの問題を解決する必要があり、いくつかのライブラリを試してみたので、それをまとめてみます。 なお、img要素ではなく、CSSの背景画像で使用する場合として検証しました。 img要素にだけ適用したい場合には、もっとシンプルな方法があるかもしれません。 概ね共通する事 標準準拠のCSSのみでは不可能 IEの独自拡張の、filterプロパティを使う必要があります。 CSS内に記述する方法やhtcファイルを使う方法、JavaScriptを使う方法でも、結果的にはこのfilterプロパティのAlph
Firefox Hacks：知らないと確実に損するUbiquity環境構築法 (1/2) - ITmedia エンタープライズ
最近大注目のFirefox拡張機能「Ubiquity」。自分でコマンドを自作できない方でもUbiquityの真の実力を知ることはできる。本稿では、コード共有サービスを利用して自分だけのコマンド環境を構築する方法を紹介する。 最近大注目のFirefox拡張機能「Ubiquity」。Google Chromeの登場で幾分落ち着いたとはいえ、その魅力に取りつかれた方も少なくないのではないだろうか。 Ubiquityの基本的な解説については「ブラウザの新境地？ Ubiquityが変える衝撃のブラウザ体験」や「Ubiquity標準コマンドチートシート」ですでに紹介してきたが、まだいまひとつUbiquityを使う気になれないという方のために、「FireFoxプラグイン『Ubiquity』に大量のコマンドを登録して日本のサイトを一発で開くすごい方法」というエントリでUbiquityの活用術を解説している
「Chromeの速さはどの程度？」比較テストの結果 | WIRED VISION
「Chromeの速さはどの程度？」比較テストの結果 2008年9月 4日 IT コメント： トラックバック (1) Adam DuVander 米Google社のブラウザー『Google Chrome』はどのくらい速いかって？ JavaScriptのパフォーマンスにこだわる(そして米Mozilla社の従業員でもある)John Resig氏が実施したいくつかのテスト結果を見ると、Chromeは確かに速いが、他のブラウザーを大きく引き離しているというわけでもないことがわかる。 Google社がChromeを発表(日本語版記事)したときには、Chromeが目にも留まらぬ速さで競合ブラウザーを抜き去ることを示すベンチマークも含まれていた。Chromeが速いことは確かで、一夜にしてウェブを変えてしまったような印象さえ受ける。ただ、統計にはよくあることだが、どのベンチマークを信じるかによって結果は変わ
MOONGIFT: » Ajax開発で使えそうなJavaScriptのHTMLレンダリングエンジン「PURE」:オープンソースを毎日紹介
Ajaxを使った開発において、Prototype.jsなどのAjaxではレスポンスを全て指定したID内に入れてしまうことでごく簡単に複雑なレンダリング結果を表示できるようにしている。Ajaxというと、結果のXMLを操作して複雑にJavaScriptを操作しなければならないというイメージに比べてずいぶん単純になり、身近になった。 サンプル だがそれでは通信量が増えてしまうのも事実だ。ごくシンプルなデータを複雑なレンダリングにつなげる、こちらを使ってみよう。 今回紹介するオープンソース・ソフトウェアはPURE、JavaScript向けのHTMLレンダリングエンジンだ。 PUREはjQueryプラグインとして動作するソフトウェアで、複雑なレンダリングを実現しようと思うとなかなか難しいJavaScriptによるHTMLレンダリングを容易にしてくれるソフトウェアだ。 クリックするとデータを追加するサ
【ハウツー】あのFirebugがIEでも使えるようになる!? 簡易版Firebug「Firebug Lite」 (1) XHRトラッキングなどをJavaScriptで実装 | エンタープライズ | マイコミジャーナル
JavaScriptで実装された簡易版Firebug - Firebug Lite 7月25日(米国時間)、Firebugの機能をJavaScriptで実装した「Firebug Lite 1.2」が公開された。FirebugはDOMインスペクタやXHR(XMLHttpRequest)のトラッキングをはじめとした、Webデベロッパにとって嬉しい機能が実装されているFirefoxアドオンだ。これまでFirebugの恩恵を受けるにはFirefoxの導入が必須だったが、Firebug Liteを使用することでFirebugの一部の機能をIEやSafari、Operaなどでも利用できるようになる。 とくにJavaScriptの動作はWebブラウザ間での差異があるため、実装した機能がデバッグの段階で一方のWebブラウザでは動作するがもう一方のWebブラウザではうまく動作しないということがよくある。Fi
ブラウザのアップデートを通知する·Pushup MOONGIFT
※ 公式サイトデモより ローカルのアプリケーションの中で、ブラウザやメーラーといったインターネットのつなぎ手になるアプリケーションはセキュリティに注意する必要がある。放置しているといつの間にかセキュリティパッチが出ており、適用していないブラウザはワームなどの被害に遭うことになってしまう。 Firefox向けの警告 そうした危険なブラウザを関知し、Web上で警告を出すライブラリがこれだ。 今回紹介するオープンソース・ソフトウェアはPushup、ブラウザバージョンチェックライブラリだ。 PushupはIE、Firefox、Opera、Safariといったメジャーなブラウザに対応したソフトウェアで、ユーザエージェントから判断して、指定したバージョン以下のブラウザを使っている場合に注意を呼びかけることができる。 Safari向けの警告 注意は面倒なものではなく、右上にGrowl風のポップアップが表
Firebug Lite 1.2登場、IE Safari OperaでFirebug活用 | エンタープライズ | マイコミジャーナル
Firebug - Firebug Lite 25日(米国時間)、Firebug Liteの最新版となるFirebug Lite 1.2が公開された。Firebug LiteはFirebugの機能をJavaScriptで実装したサブセット版。ページに挿入可能なJavaScriptとして実装されているためFirefoxのみならずIE、Safari、Operaなどのブラウザでも使えるという特徴がある。 Webアプリケーション開発やWebデザイン調整に人気のあるエクステンションがFirebugだ。しかしエクステンションとして実装されているためFirefox以外では使えないという制約がある。同じデバッグ機能をIEやSafariで試したいと思っても使えない。Firebug LiteはFirebugの機能を挿入可能なJavaScriptで実装することでIEやSafari、Operaでも動作するようにし
MOONGIFT: » JavaScriptで実現するMVCフレームワーク「JavaScriptMVC」:オープンソースを毎日紹介
最近のフレームワークではMVCが重視されている。確かに、各要素が分かれていることで分業もしやすく、問題の切り分けもしやすくなる。こうした傾向はアプリケーションの高度化、難度が高まるにつれて需要が高まってきた。 JavaScriptMVCの説明ページ となれば、最近のWebアプリケーションで多用されるようになったJavaScriptでもこうした取り組みが必要になってくるのは間違いない。 今回紹介するオープンソース・ソフトウェアはJavaScriptMVC、JavaScriptで実装するMVCフレームワークだ。 JavaScriptMVCはリッチなWebアプリケーションを実装するためのフレームワークで、REST APIを通じて取得するモデル、クライアントサイドのビュー、イベントハンドラをかねたコントローラの三つがベースになる。 コントローラ さらにプラグイン機能や、外部ファイルを動的に取り込む
MOONGIFT: Firebugと連携するPHPライブラリ「FirePHP」:オープンソースを毎日紹介
JavaScriptを多用する時代にあって、Firebugのありがたさを感じている人は多いのではないだろうか。開発の補助ツールとして、何らかの問題が起こった時のデバッグツールとして活躍していることだろう。 ログをFirebug上で確認できるようになる そんなFirebugがPHP開発において活用できるFirefoxアドオンがこれだ。 今回紹介するオープンソース・ソフトウェアはFirePHP、PHPと連携するFirebugだ。 FirePHPはFirebugをインストール済みの状態で使うプラグイン的なアドオン（分かりづらい）だ。PHP側でもPearを通じてライブラリをインストールする必要がある。それが終わったら、FirePHPのインスタンスを呼び出せるようになる。 サンプルのコード そしてログを出力することや、ダンプしたデータを出力できるようになる。また、コンソールにエラーメッセージを出力す
HTML上のテーブル操作の決定版·Flexigrid MOONGIFT
※ 画像は公式サイトデモより 業務システムのみならず、メールや一覧の機能で必要になるのがテーブルを使った一覧機能だ。このとき、比較元になるのがエクセルをはじめとした表計算ソフトウェアだろう。あのレベルのUIをWebベースで再現するのはほぼ不可能とさえ言えそうだ。 ドラッグアンドドロップによるカラムの並べ替えや表示/非表示の切り替えが可能 無理矢理カスタマイズして膨大に工数を増やすのではなく、ライブラリを使って柔軟に、素早く対応しよう。 今回紹介するオープンソース・ソフトウェアはFlexigrid、jQueryを使ったテーブル操作ライブラリだ。 Flexigridは既存のテーブルに対して利用できるライブラリで、普通のテーブルをカラムの並べ替えや表示/非表示、幅の変更など優れたUIをもったテーブルに変更してくれる。対応ブラウザはIE6/IE7、Firefox 2、Opera 9.x、Safar
ウェブ制作にかかせない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
指定したエレメントを非表示にするuser js書いた - <s>gnarl,</s>技術メモ”’<marquee><textarea>￥
clean-world.js デザインもコントロール可能にするということ。 例えば3カラムレイアウト。広告や過去ログが好きな人にはたまんないんだけど、個人的にはちょっと好みじゃない。 いらない要素は消せるべきだよね。 右上クリックして、マウスオーバーでエレメント選択。eで親要素選択。dで要素削除、aでwidth=100%、cでbackground=none。uでアンドゥ、sで保存ダイアログ(ページトップに出現)。 xpathをクッキーに保存してる。ちょっとしょぼい。xpathが複数のエレメントにマッチすると最初のにしか適用されないとか。発展途上。 Opera用だけど、firefoxでもうごくようなきがする。ためしてませんけど。 autopagerizeみたいにsiteinfo共有できたらよさそうだけど、視覚的趣味は人それぞれだからむずかしいかも。大まかな要素ごとにマークできるくらいでちょう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSS Based Web Design Gallery - Designers love nature!