ThickBoxを可愛らしく・・・
ThickBox 可愛らしくしてみませんか？
・・・・もちのロン 格好良くもなりますよ～
「ThickBoxを ”もっと” 可愛らしく・・・ 」とも組み合わせて使ってください
カンタンなカスタマイズです
例としてはピンク系にしてみました
枠をピンクにしちゃいましょ～ （別に何色でも良いんですけど・・・）
フリープラグインに貼り付けてください 注1
<STYLE TYPE="text/css">
<!--
#TB_window {
background-color: #ffc0cb;
color:#f0f;
}
#TB_Counter{
color:#f0f;
}
--></STYLE>
ＣＳＳが使える方はこちらをＣＳＳの最後にコピペください
/* ThickBoxを可愛らしく・・・ */
#TB_window {
background-color: #ffc0cb !important;/*枠の背景色*/
color:#ff00ff !important;/*タイトルの色*/
}
#TB_Counter{
color:#ff00ff !important;/*ページカウンターの色*/
}
Firefoxで閲覧する場合だけですが・・・・
角が丸くなっちゃうんです・・・
ブログにこられた方がFirefoxを使っている場合だけ角丸になります
背景画像を使っている場合は角丸にならず画像上にヘンな枠が出来ます
背景色のときだけ設定してください ・・・ あくまでもFirefoxで見たときだけです
フリープラグインに貼り付けてください 注1
<STYLE TYPE="text/css">
<!--
#TB_window {
background-image:url(画像のURL);
-moz-border-radius:15px;
color:#f0f;
}
#TB_Counter{
color:#f0f;
}
--></STYLE>
ＣＳＳが使える方はこちらをＣＳＳの最後にコピペください
/* ThickBoxを可愛らしく・・・ */
#TB_window {
background-image:url(画像のURL) !important;/*枠の背景画像*/
-moz-border-radius:15px;/*コーナー角丸*/
color:#ff00ff !important;/*タイトルの色*/
}
#TB_Counter{
color:#ff00ff !important;/*ページカウンターの色*/
}
背景画像を使っても・・・・・
フリープラグインに貼り付けてください 注1
<STYLE TYPE="text/css">
<!--
#TB_window {
background-image:url(画像のURL);
color:#f0f;
}
#TB_Counter{
color:#f0f;
}
--></STYLE>
ＣＳＳが使える方はこちらをＣＳＳの最後にコピペください
/* ThickBoxを可愛らしく・・・ */
#TB_window {
background-image:url(画像のURL) !important; /*枠の背景画像*/
color:#ff00ff !important;/*タイトルの色*/
}
#TB_Counter{
color:#ff00ff !important;/*ページカウンターの色*/
}
こんな感じになりますよ～ ←背景画像＆文字色を変更している見本サイトです
注1 ： フリープラグインに貼り付ける場合は
必ずすっぴんバージョン より後ろに書いてください
後ろであればどこでもかまいません
※ページを読み終わってから動作します
画像が多かったりJavaScript等で重くなっている場合は動作するまでに時間がかかります
その場合は今まで通りに新しい画面が立ち上がって表示されますが、すぐに動作し始めます
読み終わっても動作しない場合はどこかが間違っています・・・・
エラーは表示されますが気にしなくてもOKです
ソースを開いて記事中のミスを探して訂正下さい
ここの常連さんラビリンスさまはこのようにされました
さまはこうなりました
男は黒！でしょ・・・もう少しお待ち下さい
とりあえずは背景色を黒系統に文字を白にすればらしくはなりますm(_ _)m
2008.8.6
アメブロの画像表示方法の変更によりThickboxは自動では使えなくなりました
ど～しても使いたい方は・・・面倒でもいいよって方は・・・