§10-13Layout
ピーク preview (hover カード)
リンクに重ねると内容の要約カードを表示する。
ページを移動せずにリンク先やユーザーの概要を確かめられる。参照リンクが多いドキュメントや、プロフィールが頻出する SNS に向く。
実装のポイント
表示と非表示に少し遅延を入れて誤発火を防ぎ、カード上へのポインター移動では閉じないようにする。hover できない端末向けにフォーカスや長押しでも出す。
- 特徴
- 状態管理
- デモで使っているもの
- lucide-react
§10-13Layout
リンクに重ねると内容の要約カードを表示する。
ページを移動せずにリンク先やユーザーの概要を確かめられる。参照リンクが多いドキュメントや、プロフィールが頻出する SNS に向く。
表示と非表示に少し遅延を入れて誤発火を防ぎ、カード上へのポインター移動では閉じないようにする。hover できない端末向けにフォーカスや長押しでも出す。