ホバーするとサムネイル画像がズームするお知らせ欄

MATEREATE INFORMATION

サイトのお知らせやブログ記事の新着情報などで使えるボックスデザイン素材です。サムネイル画像と記事のタイトル、記事の抜粋(または本文)を表示しています。ボックスをマウスホバーすると、サムネイル画像がズームされます。またタブレット端末以下では、デザインが少し変わって表示されます。

素材の詳細

infoボックス素材のパソコン画面でのデザイン
パソコン画面でのデザイン

サムネイル画像、記事のタイトル記事の抜粋(または本文)を表示するデザインです。横辺が長いボックスとなっております。

infoボックス素材のモバイル画面でのデザイン
タブレット、スマホ端末でのデザイン

タブレット端末とスマホ端末では上記イメージのように縦辺が長いボックスのデザインに変化します。

infoボックス素材のホバー時のデザイン
マウスホバー時のデザイン

ボックス内でマウスをホバーすると、サムネイル画像が少しズームされます。またリンク先を指定すれば、その記事へアクセスすることもできます。

infoボックス素材の追加説明のデザイン
内容が長い時のデザイン

記事の抜粋(または本文)が長い時は、スクロールバーが自動で追加されるため、デザインを崩すことなく表示できます。