>> 
画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1
 >> 
画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

スポンサーサイト

  • このエントリーをはてなブックマークに追加
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

  • このエントリーをはてなブックマークに追加

画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

涼しくもあり、少し暑い感じもする管理人です。


今回はWebサイト制作中に便利だと思ったアドオンです。
ブラウザの閲覧ページに画像を重ねて表示させて、画像の位置やサイズの確認に使っています。




Pixel Perfect 0.6.1

使用方法

インストールすると特に設定もなく使用できますが、このアドオンは、Firebug を先にインストールする必要があります。

Firebug :: Add-ons for Firefox

以下、実際に使ってみた様子です。



画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

両方インストールするとブラウザの右下に Firebug と Pixel Perfect のアイコンが表示されます。



画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

青色の Pixel Perfect のアイコンをクリックすると↑のように表示されます。



画像の追加

画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

Add overlay」をクリックすると画像を追加できます。



画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

追加した画像にチェックを入れる(赤丸)と閲覧ページに画像が表示されます。



画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

上記のように表示されます。
(使用した画像は私のPSP用の壁紙です。Download)



画像の透明度の調節

画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

Opacity から、画像の透明度を調節できます。
左側をクリックすると画像が薄くなっていきます。細かく合わせたい時には便利です。



画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

右側をクリックすると画像は濃くハッキリと表示されます。



画像位置の調節

画像などをオーバーレイ表示させて確認ができる Pixel Perfect 0.6.1

Position からは画像位置を細かく調節できます。

矢印の方向に1pixelごとに移動できます。画像をドラッグしても移動させることができます。



Pixel Perfect 0.6.1

ドラッグで希望の箇所に持っていき、微調節は Position で行えますね。




インストールページ

関連記事
-0 comments
管理者にだけ表示を許可する
-0 trackbacks