仮画像をホバーしたときにコンテンツを配信する
仮画像(サムネイル画像)をマウスオーバー(スマホではタップ)したときに,SVGなどのコンテンツをオーバーレイして表示する.
iframeで埋め込むよりも初回の読み込み量が少なく済む.
埋め込むものが画像なので,制限が少ない.
ifarmeをScrapboxに埋め込むことはできないが,サムネイル画像はいける.このサムネイルの上にメインコンテンツをオーバーレイすることは可能. ifarmeをSlackに埋め込むことはできないが,サムネイル画像はいける.
外部JavaScriptファイルとして配信することも可能だが,自分が管理するサイトでないと読み込めないのが難点 この仕組みを利用したもの
https://svgscreenshot.appspot.com/c/x/xxxx.png のようなURLを持つサムネイル画像に対してSVGコンテンツをオーバーレイする.
一般化の案
任意のサムネイルURLに対して拡張する
https://example.com/<任意>/<オーバーレイするコンテンツの拡張子>/xxxx.png
https://example.com/<任意>/xxxx.<オーバーレイするコンテンツの拡張子>.png