素敵なブログ見つけました
デザインも綺麗なブログと思ったんですけど、私が感激したのは「読者ボタン」。
(私は基本的にPCでブログを拝見しています)
「読者ボタン」にマウスを持っていくと、「ありがとうございます」って表示に変わるんです
素敵な気配り感じました
マウスを持っていって画像が変わる設定自体は、よく使われる技術なので知ってましたが、こういうふうに使うこと、思いつかなかった。。。
アイデアや発想には気持ちが表れる、って改めて思いました。
で、早速アメブロだとどうやって設定するのかなぁ、とやってみました
Before
▼
▼
▼
通常の表示
マウスを持っていった時の表示
設定方法を参考にさせていただいた記事をご紹介しますね。
ただ、
上記記事のクラス名(「.readerRequestBtnArea .readerBtn」の部分)では、私の場合、表示が変わりませんでした。
同じような方いらっしゃるかもなので、私の設定も載せてみます。
/******* ↓カスタム:読者ボタン↓ *******/
.skin-btnSidePrimary{
height : 58px;
width : 200px;
background-image :url(★★★通常時に表示させたいボタン画像のURL★★★);
text-indent :-9999px;
overflow:hidden;
position: relative;
z-index: 9999;
}
.skin-btnSidePrimary:hover{
background-image :url(★★★マウスが乗った時に表示させたいボタン画像のURL★★★);
background-position :center top;
background-repeat :no-repeat;
}
/******* ↑カスタム:読者ボタン↑ *******/
.skin-btnSidePrimary{
height : 58px;
width : 200px;
background-image :url(★★★通常時に表示させたいボタン画像のURL★★★);
text-indent :-9999px;
overflow:hidden;
position: relative;
z-index: 9999;
}
.skin-btnSidePrimary:hover{
background-image :url(★★★マウスが乗った時に表示させたいボタン画像のURL★★★);
background-position :center top;
background-repeat :no-repeat;
}
/******* ↑カスタム:読者ボタン↑ *******/
必ず現在の設定をテキストファイルなどにコピペして、バックアップしておいてから設定を変更してくださいね。
→→うまくいかなかったら、元の設定に戻す際に必要です。
あの「読者ボタン」。
対面じゃないブログに、対面のような接点を感じた一瞬でした。
クミシュランさん。
だれでも輝ける、内面の美しさに着目した案内人、って感じのブログでした。
ほんと素敵です
対面じゃないブログに、対面のような接点を感じた一瞬でした。
クミシュランさん。
だれでも輝ける、内面の美しさに着目した案内人、って感じのブログでした。
ほんと素敵です

「Happy Clover」って
「Happy Clover」の
「パソコン操作個別レッスン」
つながってくださる方、募集中
よろしくお願いします