Googel Fonts(Englishi①)

英語Googleフォントを表示しております。
全(①ー⑧)ページの記事です。
サンプルは画像処理されています。
縦スクロール(映画サイネージ)

縦スライダーをデジタルサイネージ(電子看板)風の設定にしてみました。
Hover Box(Woman)

マウスをホバーさせることにより、BOX化された表示が変化します。
*DEMOではボタンは機能はしませんが、メニューとしての応用も可能です。
Stickyフッター

フッターは本文コンテンツの下に隠れており、スクロールすると現れます。
背景で反転+すりガラス効果

●ヘッダーの画像やテキストが、本文コンテンツの色に合わせて反転します。
●ヘッダーは半透明にしており、すりガラス効果により重なった本文をぼかします。
*ヘッダー領域が分かりやすいように、下枠線を設定しています。
特殊背景 -Dots

なまらかな動きのある特殊なアニメーションです。
アイコンサイドバーメニュー

画面の端にアイコンで表示されるメニューです。
コンテンツマスク機能

この機能ではコンテンツやセクションをマスクして一部だけを表示し、クリックすると残りの100%(全体)を表示します。
テキスト切替アニメーション

テキストを、40種類のアニメーション効果です。
Hover Video Box2

上下方向に分割されたビデオ上にマウスを重ねる(ホバー)ことにより、ビデオ表示が変化します。
*ボタンはサンプルにつき機能しません。
考察 -Data Table(表)について

フルレスポンシブデザインでも、Data Table(表)のデザインには注意が必要です。
Good shot!

360°パノラマとマウスの移動に反応する機能でゴルフをイメージした応用例です。
画像アニメーションーーCircle

丸型の画像を素材にした8種類のアニメーションです。
背景スライダー-ランダムスライダー

ユニゼロワンのスライダーには非常に多くの種類があり、設定によってさらに様々な機能を発揮します。
セクションの背景にランダムスライダーを設定しております。
縦書きにも利用できるフォント

和風のページ制作に欠かせない、縦書きに適したフォントです。
ボタン

72種類のボタンのアニメーションをご紹介しています。
各種チャート

様々なチャートのご紹介です。
ホットスポット

設定したポイントにマウスカーソルを重ねると、画像やテキストなどをポップアップ表示します。
Parallax効果

Parallax効果(視差効果)と呼ばれる機能です。
画面上でマウスを動かしてみてください。(スクロールではありません)
マウスの動きに合わせて動く何枚かの画像を重ねて表示しています。
アイデア次第で様々な表現が可能です。
プライスメニュー(価格表)

プライスメニュー(価格表)です。
合わせてページ下部に、区切りアニメーションを設定しています。
Flip BOX

ボックスの内容がマウスのホバー操作で変化します。
進捗バー

進捗状況の表示に適したBAR表示です。
背景スライダーーFade

画像のフェード効果を背景に設定しています。
背景スライダーーSlide Up

【Slide Up】
画像のスライドを背景に設定しています。
テキスト スクロール

WEBページのタイトルを電子版表示する「TICKER」とよく似ていますが、この機能では、文字をスクロールして表示します。
また、文字以外のスクロールも可能です。