余白を使って簡単に余白のテキストを任意のWebサイトに追加する

インラインツールチップ 素晴らしいですが、時には彼らは特定のコンテンツにうまく適合しないことがあります。ほとんどのウェブサイトはページ本文に沿って余白にスペースを残しており、これは追加するのに最適です。 ツールチップのないツールチップスタイルのコンテンツ.

入る余白, 無料のオープンソースのjQueryプラグイン カスタムメモを余白に追加します あなたのWebページの。リンクやページ上の特定の要素（画像など）に基づいてこれらのメモを切り替えることができます。.

このプラグインは設定が驚くほど簡単で、それは付属しています デフォルトスタイルシート あなたのマージンノートのために。これらが現れる横へあなたのコンテンツとあなたのWebページの段落要素のすぐ隣に並んでいる.

ホバーノートは 手動で追加 あなたのHTML要素に, を使って desc 属性. 私はこれをHTML 5で見たことがないので、完全に準拠しているかどうかはわかりません。しかし、それはあなたが本当に必要とするすべてであるJavaScriptによって拾われるのですか.

あなたもすることができます この属性を変更する 実行すると marginotes（） 関数なので、次のように変更できます。 データ記述 より準拠したい場合.

これが 1行のjQuery このプラグインを動作させるために必要なもの：

 $（ "selector"）。marginotes（）

あなたが交換する必要があります "セレクタ" ターゲットにしている要素は何でも。そのため、それらがあなたのページ本体の中にあるなら、あなたは使うかもしれません "。ボディスパン". あなたも ターゲットアンカーリンク または 特定のクラスで これらの要素に追加.

の中 marginotes（） 機能は、あなたが追加することができます 2つのオプションパラメータ マージンノートの書式を変更するには

また、jQueryを使いたくない場合は、 vanilla Marginotesプラグイン. それはバニラJSで動作するので、あなたは持っています 依存関係がない すべて同じ機能を取得する.

こちらもチェックできます ライブデモ あなたがそれを実際に見たいのなら。これは間違いなくユニークなプラグインです、そしてそれは素晴らしい方法です。 コンテンツを追加する あなたのサイトへ.