【jQuery】リンクの後ろのテキストを非表示にするためのライブラリExpounder

Expounderはリンクの背後にあるテキストを非表示にすることができ、リンクをクリックすることでテキストを展開するJS / CSSライブラリです。

読み込み

<script src="https://gitcdn.xyz/repo/skorokithakis/expounder/master/expounder.js"></script>
<link rel="stylesheet" href="https://gitcdn.xyz/repo/skorokithakis/expounder/master/expounder.css" />

HTML

Hello! I am an <span data-expounder="term">obscure term</span>.
<span data-expounded="term">An obscure term is something that
bears more explanation, so we're explaining it here. This text will be
hidden, as some people may be familiar with it.</span>  This next
sentence will be visible to everyone again.

CSS

要素に異なるスタイルを設定したい場合の例。下記はspanをイタリック体にする。

span[data-expounded] {
font-style: italic;
}
 
Expounder

【jQuery】リンクの後ろのテキストを非表示にするためのライブラリExpounder

  • LATEST
  • RELATED
  • POPULAR