ちょっとした「Webお役立ち情報」とかを主に書いてます。

ネットで調べて、「わかったこと」を備忘録の代わりのメモ帳のようにして使ってます。


テーマ:
リンクにマウスが乗った時にフェードさせる方法


こんにちワ。ワンタンです。

「CSS編集用デザイン」の場合、初期設定では、リンクにカーソルを乗せると青色から赤色に瞬間的に色が変わります。
それをゆっくり変わるようにする方法を御案内してみたいと思います。

CSSを使います。

「CSS編集」の末尾に以下のコードを追記して下さい。


/* リンク色をフェード */
a{
transition: color 0.5s ease 0s;
-webkit-transition: color 0.5s ease 0s;
}

注:2ヶ所の0.5は、0.5秒という意味です。大体0.5位で丁度いいと思います。


***追記:記事タイトルやページ切替ボタンにも適用する方法***

記事タイトルやページ切替ボタンもカーソルが乗った時に、色がフェードして変わるようにしたい場合は更に以下のコードを「CSS編集」に追記して下さい。

/*記事タイトル、次へボタンをフェード*/
.skinSimpleBtn:hover,.skinArticleTitle:hover {
color: #f24a75;
}

※カーソルが乗った時に変化させたい色コード;#f24a75は、お好みのものに差し換えて下さい。
※参考迄に⇒色見本と配色サイト - color-sample.com


以上、リンクにカーソルを乗せた時に、ゆっくり色が変わるようにする方法を御案内してみました。

参考になると嬉しいのですが・・


☆ブィブィ  ('-^*)/


一子相伝、他のニャンコには真似の出来ない技ニャのだ!!

いいね!した人  |  コメント(0)

ワンタンさんの読者になろう

ブログの更新情報が受け取れて、アクセスが簡単になります

AD

ブログをはじめる

たくさんの芸能人・有名人が
書いているAmebaブログを
無料で簡単にはじめることができます。

公式トップブロガーへ応募

多くの方にご紹介したいブログを
執筆する方を「公式トップブロガー」
として認定しております。

芸能人・有名人ブログを開設

Amebaブログでは、芸能人・有名人ブログを
ご希望される著名人の方/事務所様を
随時募集しております。