Segmented Arrow Launch
斜めに分割したボタンの矢印パネルが滑り、文字側との重なりが反転する。
PRACTICAL WEB TIPS
Hover Effects
実際に動くWeb制作素材。プレビューで試して、HTML・CSSコードを確認できます。
使用対象から探す
ボタン・テキスト・画像など、実際に使う場所で分類しています。
適用中：用途: portfolio
69 items条件に一致する公開素材
Case Result Reveal
制作実績カードで成果数値をホバー時に下から展開する。
Split Gallery Expansion
2つの画像パネルの比率が変化し、右側の作品が主役になるギャラリー表現。
Column Index Navigation
縦ナビのホバーで小さな番号レールが伸び、メニューが連続した流れで移動する。
Syllable Stair Link
3つの語句が階段状にずれながら浮上。短い見出しリンクに向くタイポグラフィ。
Perforated Poster Reveal
ポスターの切り取り線に沿って前面が抜け、裏側の作品情報が見える画像ホバー。
Typesetter Tracking Gauge
見出しにホバーすると、文字間隔と同期した目盛りが展開するタイポグラフィー用の演出です。
Triptych Focus Gallery
3連写真のうち、注目した画像だけが横へ伸びるギャラリー演出。作品一覧の閲覧に使えます。
Studio Contact Print
写真作品にホバーすると暗室のコンタクトプリント風の余白と撮影番号が現れます。
Color Lab Sample Scan
素材見本の半透明な色版が移動し、ベース素材と仕上げ色を比較できるホバー。
Project Stage Menu
制作工程メニューの行ホバーで工程の短い説明と進行方向が表示されます。
Stacked Annotation Headline
見出しの上に重ねた小さな注釈がホバーで持ち上がり、章題を際立たせる。
Print Corner Curl
写真プリントの隅がめくれ、撮影情報が裏面から現れるホバー。
Correction Line Swap
編集前の語句を取り消し線で示し、ホバーで訂正後の見出しが置き換わるエディトリアル演出。
Curtain Slat Landscape
写真を5本のスラットに分割し、ホバーすると各帯がわずかにずれて奥行きを生む作品ギャラリー演出。
Photo Contact Strip Lift
横並び写真の一枚をホバーすると上方向へ持ち上がり、作品名と日付ラベルが現れるギャラリー演出。
Material Sample Envelope
カタログの素材見本に触れると紙のスリーブから色見本が持ち上がり、材質名が表示されるカード。
Tiled Panorama Contrast
同じ風景を3枚の切片に分け、ホバーした切片だけ鮮やかになり、細いインデックス線が現れる。