株式会社アプリコットデザイン株式会社アプリコットデザイン

tel.0120-622-835

営業時間/10:00〜18:00 定休日/土日祝日

tel.0120-622835

営業時間/10:00〜18:00 定休日/土日祝日

  • instagram
  • facebook

BLOGスタッフブログ

トップページ > ブログ > ホームページで出来る素敵なデザインやアニメーション

ホームページで出来る素敵なデザインやアニメーション

UPDATE : 2016.11.02

CATEGORY :
Apricot Staff
Apricot Staff

Apricot Staff

ホームページの装飾について少しお話したいと思います。
今はいろいろとオシャレなホームページを見かけますよね。
マウスや指で触ると色が変わったり滑らかに動いたりいろいろな機能が実装されていますね。

ホームページの動きや装飾の部分はCSSやJqueryといったプログラムを使っています。
特にCSSはレイアウトを整えたり動きを出せたりとなかなか出来る奴なのです。
今回はそんなCSSと言うプログラムを使ってこんなことが出来るよっていうのを紹介して行きたいと思います!

今回はボタンのアクションを紹介します。

まずはよく見るボタンです。
触ると背景の色が抜けて周りが赤くなります。

Button
次は下から蓋が閉まるようなボタンです。
Button
3つ目はクルッと回るボタンです。
ButtonButton
4つ目はボタンを押すと波紋が広がる仕様です。
Button
ホームページでよく見るボタンですがちょっとした一工夫でなんだかリッチになりましたね!

他にもエフェクトを変えればいろんな表現のボタンが作れます。

今回はボタンをいくつか紹介いたしましたが、後々もっとアニメーションの効いたものを紹介したいと思います!

RELATED POST関連する記事

CONTACTお問い合わせ

tel.0120-622835

営業時間/10:00〜18:00 
定休日/土日祝日

  • 信州ファームデザイン
  • 信州ファームマーケット
  • 株式会社POCKET
  • 株式会社Think for Design