[JS]画像に見出しとキャプションをスライド表示させるチュートリアル

jQueryを使用して、画像に半透明の見出しとキャプションをスライド表示させるチュートリアルをQuenessから紹介します。

Create a Thumbnail Gallery with Slick Heading and Caption Effect with jQuery
demo

デモでは画像にマウスをホバーすると、上から見出し、下からキャプションをスライド表示させます。
見出しとキャプションは画像の前後にdiv要素で実装されています。

HTML

スクリプトはjQueryとそのプラグインjQuery Easing Pluginが使用されています。