detail
/ category : computer / date : 201205  » reset
rep2ツールバーのRetina対応 rep2はそれはもう愛用しておりますが、Retina大好きっ子としてはiPhone用表示のツールバーの画像が荒く見えてしまうのがちょっと。。。
新しいiPadだと特に気になるところですよ。

ということで、ツールバーをRetina対応しました覚え書き。

/rep2/iui/footback.png
/rep2/iui/foottool.png
/rep2/iui/foottab_sure.png
この3画像をそれぞれ縦横2倍のピクセルで作り直す。
わかりやすく下記のようなファイル名で保存。
/rep2/iui/footback@2x.png
/rep2/iui/foottool@2x.png
/rep2/iui/foottab_sure@2x.png

アイコンとかは自分好みで。

/rep2/iui/iui.css を下記のように編集。
#foot のところを、
background-image:url(footback@2x.png);
background-size:1px, 50px;
background-position:0px 1px;
.foot_sure span のところを、
background-image:url(foottab_sure@2x.png);
background-size:320px, 100px;
と変更&追加。

/rep2/iui/read.css を下記のように編集。
#footbar01 のところを、
background-image:url(footback@2x.png);
background-size:1px, 50px;
background-position:0px 1px;
opacity:1;
.footbar>ul>li のところを、
background-image:url(foottool@2x.png);
background-size:320px,100px;
と変更&追加。opacityは別に変えなくていいけど、まぁここは好みで。

これでrep2生活が更に幸せに!
| 1 |