ロールオーバー効果 画像がずれる | YouTubeで月100万稼ぐための教科書

マウスを乗せるとピクっと画像やテキストリンクがずれるやり方

j_03

画像やテキストリンクにマウスを乗せると、

ピョコンと画像がずれたり、画像が薄くなったりしますよね?

そのやり方を教えたいと思います。

下の画像にマウスを載せてみてください。

画像が右下に少しずれて、画像の透明度が薄くなりますよね?

j_03

そのやり方は、

「CSS」に少し手を加えるだけで簡単に出来ます。

1.まずWPのダッシュボードを開き、「外観」 ⇒ 「テーマ編集」を開きます。

ロールオーバー効果 画像がずれる

2.「design.css」を開きます。

123

3.下記のタグを挿入します。

【画像を右下にずらす】

a:hover{
position: relative;
left: 2px;
top: 2px;
}

【画像の透明度を落とす(光ったように見える)】

a:hover img {
opacity: 0.7;
}

この2つのタグを入れる事で、リンク画像がずれて、光ったように見えるようになります。

タグを入れる場所は「design.css」の中であればどこでも構いません。
わかりやすいように一番最後なんかがいいでしょう。

ずらしの幅や、透明度の加減などは数字を変える事で調整が可能です。

試してみてくださいね^^

lgi01a201403140200 YouTubeアドセンスでガチで稼ぐための特別メルマガ

↑↑YouTubeマル秘テクニックを
メルマガだけで公開中!↑↑

lgi01a201403140200 30日間最新ネットビジネスノウハウ講座
月10万を手堅く稼ぐ方法&SNSツールプレゼント中!

↑↑ブログでは書けない秘密の稼ぎを公開します!↑↑

初心者の方でもわかりやすく丁寧に解説しています。

今ならアメブロやmixi最強集客ツールや優良画像素材など様々なプレゼントを差し上げています。

合わせて読みたい記事

シェアする

フォローする

『マウスを乗せるとピクっと画像やテキストリンクがずれるやり方』へのコメント

  1. 名前:畑紀寿 投稿日:2013/06/30(日) 19:59:37 ID:46abf2d1b

    パーソナルトレーニング専門studioを経営しています。
    東京では、流行っていますが、広島にはまだ馴染みが少ないです。

    ただ、人々に自分がやっていることを伝えることができたら、もっと稼げると思います。

    HPを検索してくれる方はお客様になりますが、広島にパーソナルトレーニング専門店があることを知らない方が非常に多いんです。

    テレビにでるのが、今は一番かなと思ってますが、どう感じますか?

    ご意見を伺うことができれば、嬉しく思います。

    目標は全国フランチャイズのパーソナルトレーニング専門店を創ることです。

    • 名前:加倉 淳治 投稿日:2013/06/30(日) 23:34:24 ID:f28350ee7

      畑紀寿さんコメントありがとうございます!

      絶対にやった方がいいと思うのは、ブログとfacebookです。
      facebookはリアルタイムに多くの人に情報を伝える事が出来るので、
      スタジオの雰囲気や、スタッフの方などの人柄がわかるような投稿をして
      そこにHPのリンクを貼っておくだけでもアクセスは上げると思います。

      ブログでは、スタジオの魅力なんかをたくさん書いて、
      ツールなんかを使って自動でアクセスを集めると効率的に集客出来ると思います!

      やっぱりテレビの影響はかなりあると思いますが、テレビに出るというのもなかなか難しいと思うので
      口コミやSNSを有効的に使っていった方がいいと思いました!

      全国フランチャイズのパーソナルトレーニング専門店、応援しています!!!

コメントをどうぞ

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>