WordPress 画像にマウスが乗った時にフワッと半透明にするjquery

Article views177 VIEW

b1f84567 s - Wordpress 画像にマウスが乗った時にフワッと半透明にするjquery更新さぼっていました。

「あれ?僕この記事書いてなかったのか??」というjqueryネタがあったので更新しようと思います。

タイトルにもあるように「画像にマウスが乗った時にフワッと半透明にするjquery」 っスね。

「何言ってんだお前」って感じでしょうが、まぁちょっと下の画像を試して下さい。

 

a0a149b4 s - Wordpress 画像にマウスが乗った時にフワッと半透明にするjquery

意味がわかったと思います。

様はリンクで使ってる画像の透明度をマウスオンでフワッと変えたいという事です。

これをするだけでサイトが少しだけシャレオツになるのでオススメっす。

実装方法は続きを 

ファイルの作成

まずhover.jsを作成

 これをサーバーにアップ!!

ヘッダーに記入

9922116e s - Wordpress 画像にマウスが乗った時にフワッと半透明にするjquery

 僕はいつもこのように記載しています。
※必ずjquery本体を読み込んでから、hover.jsを読み込んで下さい!

画像のclassに追記

画像のクラスにhover_imgを追記します。

これで終わりっす。

フワッとなりましたか?

フワッとならない場合はヘッダーに記載しているファイルの順番を入れ替えてみて下さい。

参考にしたサイト

ホバー時にふわっと透明度を変えるjQueryのコード

Pocket
pinit fg en rect gray 28 - Wordpress 画像にマウスが乗った時にフワッと半透明にするjquery
line88x20 - Wordpress 画像にマウスが乗った時にフワッと半透明にするjquery
[`evernote` not found]

Leave a Comment

CAPTCHA