SQLの窓

2015年03月14日


IE開発者ツールでブラウザが表示しているページ内の色コードを取得する『カラーピッカー』


昔はカラーの値を #FFFFFF 形式で取得できていましたが、IE11 では rgba 形式でしか取得する事はできないようです( 英文の解説にもありませんし )

さらに、クリップボードにコピーしたい場合は rgba 部分をマウスで選択して( readonly のテキストフィールドのようなので、キーボードも使えます )、CTRL+C でコピーする必要があります

IE11




▼ 古い IE





ごく普通のカラーピッカーです。スポイトカーソルの状態で左クリックするとその位置の色コードを取得する事ができます。後は、『コピーして閉じる』ボタンでクリップボードに転送して使います。


posted by lightbox at 2015-03-14 11:13 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2014年07月01日


IEの開発者ツールで JavaScript を整形する


IE11 〜 IE9 でそれぞれ UI が違います。

IE11

ソースを表示してから、{三} のようなアイコンをクリックします。Google Chrome での整形アイコンも {} です。



IE10







IE9

コンボボックスより選択して、その JavaScript を読み込んでいる WEB ページを用意する必要がありますが、後は「JavaScript の書式設定」を選ぶだけです。



整形後は、右クリックでポップアップメニューより「全て選択」してクリップボードへコピーするといいでしょう。



Microsoft ドキュメント

F12 開発者ツールを使用して JavaScript エラーをデバッグする

整形されたサンプル

圧縮された jQuery のコードを IE の JavaScript の整形機能で読めるようにしたもの

関連する記事

Google Chrome デベロッパーツールの JavaScript の整形




posted by lightbox at 2014-07-01 20:52 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2014年03月08日


IE11 の開発者ツールの『コンソール(CTRL+2)』と一番下の『エミュレーション(CTRL+8)』の切り替え

まもなく WindowsXP から Windows 7 に移行が実際問題となり、それに伴って IE8 から IE11 への移行も強制されてしまいます。それまでと、その後と両方で、『エミュレーション』の正しい利用が IE 使いには必須になると思います。その際、この切り替えもまた必須です。

F12 で開発者ツールが開いた場合、その時点では開発者ツールにフォーカスが移動してアクティブになっています。その状態では、キーボードの上段にある数字キーを使って CTRL + 2 と CTRL + 8 で移動できます。



ページのほうがアクティブになっている場合は、開発者ツールの部分をマウスでクリックするか、F12 で一旦閉じてから再度開くとアクティブになります。

それ以外では、他のツールが開いている上体で、CTRL + アポストロフィ でツールの下にコンソールが開きます。







posted by lightbox at 2014-03-08 23:12 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2013年03月11日


IE開発者ツール : ユーザーエージェント文字列の変更

ユーザエージェント | サービス・機能 | NTTドコモ

NTT ドコモの情報を元に、例えば「DoCoMo/2.0 F900i(c100;TJ)」を利用する場合、フレンドリ名に指定した文字列が、メニューに表示されます。

IE10 のスクリーンショット



IE9 の時のスクリーンショット



フレンドリ名に自分が判断する為の識別用の名前を入力して、その下にユーザーエージェント文字列をセットして『追加』ボタンをクリックします。






必要な時にこのフレンドリ名を選択して再表示すると、表示されているページに設定したユーザーエージェント文字列が送られて、そのページがそのユーザーエージェント文字列に対応していた場合は表示が変更されます。

Seesaa ブログでは、以下のようになります。
( 携帯仕様 )



もう一度変更するまでは、F12 で閉じても状態は継続されます

更新履歴
2011-11-28 : 最初の記事作成
2013-03-11 : IE10 での開発者ツールのスクリーンショット追加


posted by lightbox at 2013-03-11 01:25 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2013年02月28日


IE のドメイン毎のクッキー削除


IE8もIE9 も開発者ツールの『キャッシュ』メニューより削除できます



ブラウザ全体の削除

CTRL + SHIFT + DEL で以下のダイアログを表示させて、クッキーのみをチェックして削除します。このチェック状態は保存されるので、次回の関連処理では再びチェックしなおす注意が必要です。



他のブラウザでのクッキーの削除

※ 個別の削除は結構皆面倒なので注意して下さい

■ Google Chrome
設定 => 詳細設定 => プライバシー => コンテンツの設定 => 全ての Cookieと サイトデータ => サイトを選択して右端の x をクリック

■ Firefox
オプション => プライバシー => Cookieを個別に削除 => サイトを選択して削除

■ Opera
設定 => 詳細設定 => Cookie => Cookie設定 => サイトを選択して削除

■ Safari
設定 => プライバシー => 詳細ボタン => サイト(クッキー)を確認して削除

関連する記事

IE、Firefox、Chrome、Opera、Safari のキャッシュ削除のショートカット
ブラウザ毎の「開発者ツール」の起動
IE、Firefox、Chrome、Opera、Safari で JavaScript を無効にする
ブラウザ別『Java 無効』



posted by lightbox at 2013-02-28 10:00 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2011年11月23日


IE10までは、開発者ツールで、ソースを表示する時のエディタを変更できました

IE11 では、レジストリ変更する必要があります。

ドキュメントを見る限り、IE8 も IE9 も同じようです。
( F12 開発者ツールを使用する )

IE10 のスクリーンショット



規定のビューアが選択されていると思います。その他を選択するとファイルを選択するダイアログが表示されるので、任意のエディタを選びます。エディタを変更する場合は、「その他」を再度選択します


IE8 のスクリーンショット




更新履歴
2013/03/11 : IE10 のスクリーンショット追加と、それに合わせて文言を多少変更。



posted by lightbox at 2011-11-23 17:38 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2011年06月22日


IE8とIE9のconsoleコマンドの大きな違いとIE9のcd()コマンド

IE8 の開発者ツールドキュメント

開発者ツールを使用したスクリプトのデバッグ

IE9 の開発者ツールドキュメント

F12 ツールのコンソールを使ったエラーおよびステータスの表示 (Windows)

以下は、IE9 で使える console コマンドですが、IE8 では、
console.log、console.info、console.warn、console.error、console.assert
しか使えませんでした。

IE9 で注目は、console.dir です。( プロパティを JSON 表現しますが一階層 )
コマンド説明
log(message)
window.console.log("This is a logging message");   
"message" を、先頭に "LOG:" を付けてコンソールに出力します。"window.alert()" の代わりに使用します。
warn(message)
window.console.warn("This is a warning message");
警告の "message" をコンソールに出力します。メッセージの先頭には、警告アイコンが表示されます。"window.alert()" の代わりに使用します。
error(message)
window.console.error("This is an error message");  
エラーの "message" をコンソールに出力します。メッセージ テキストの色は赤色で、先頭にエラー アイコンが表示されます。"window.alert()" の代わりに使用します。
info(message)
window.console.info("This is an info message");
情報の "message" をコンソールに出力します。メッセージの先頭には、情報アイコンが表示されます。"window.alert()" の代わりに使用します。
clear()
window.console.clear();
コンソールのメッセージを消去します。スクリプトのエラー メッセージや [コンソール] のコマンド ラインに入力したスクリプト コードは消去されません。[コンソール] ウィンドウを右クリックし、[コンソールのクリア] オプションをクリックすると、メッセージがすべて消去されます。
dir(object)
window.console.dir(oExample);   
"object" のプロパティをコンソールに出力します。
assert(expression, message)
window.console.assert((x == 1),
 "assert message: x != 1"); 
"expression" の結果が false の場合に "message" を出力します。
profile(report)
window.console.profile("My profile report");
"report" というタイトルで、プロファイル情報の記録を開始します。このコマンドは、[プロファイル] タブで [プロファイリングの開始] ボタンをクリックしたときと同じ処理を実行します。
profileEnd()
window.console.profileEnd();
最後のレポートタイトルでのプロファイル情報の記録を停止します。このコマンドは、[プロファイル] タブで [プロファイリングの停止] ボタンをクリックしたときと同じ処理を実行します。 "Report" は、[プロファイル] タブで表示できます。
さらに、cd() コマンドで、トップレベルウインドウの参照で( デフォルト )
cd( フレームのid ) で、そのウインドウ内がカレントになります


関連する記事

IE8 : 開発者ツール(デベロッパーツールズ) の console API の正しい詳細


posted by lightbox at 2011-06-22 01:26 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする

2010年09月05日


IE8 : 開発者ツール(デベロッパーツールズ) の console API の正しい詳細

英文ですが、以下のページの後半に詳細があります。
Debugging Script with the Developer Tools

Ief12_ms

データを表示するバッチメソッドとしては5つありますが、いずれも
内容は Firebug と同じで、表示されるアイコンが変わるようです。

console.log
console.info
console.warn
console.error
console.assert
for( x in console ) で調べましたが、Google Chrome も Firebug と互換性があります。 ※ Google Chrome は dir も dirxml もあります。 また、Firebug と同じく %d や %s や カンマも使えます。 後、リンク先の最後には、console.clear(); の存在について書かれていますが、 Firebug に合わせる為には以下のようにして自分で作りなさいという事のようです。
console.debug = function(name, value){
	console.warn("DEBUG: " + name + "==" + value);
}

Firebug Console API

IE8の開発者ツールショートカットキー

Developer Tools Keyboard Shortcuts Reference

※ CTRL + P でドッキングとその解除を交互に行います
※ ドッキング中に CTRL + M で最小化と表示を交互に行います


posted by lightbox at 2010-09-05 23:35 | IE開発者ツール | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します


Windows
container 終わり

フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

Android SDK ポケットリファレンス
改訂版 Webデザイナーのための jQuery入門
今すぐ使えるかんたん ホームページ HTML&CSS入門
CSS ドロップシャドウの参考デモ
PHP正規表現チェッカー
Google Hosted Libraries
cdnjs
BUTTONS (CSS でボタン)
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり