レッスンに戻る

要素の近くにメモを表示する

重要度: 5

position に応じて elemanchor 要素の近くに配置する positionAt(anchor, position, elem) 関数を作成します。

position は次の 3 つの値のいずれかに設定された文字列である必要があります

  • "top"elemanchor の真上に配置します
  • "right"elemanchor の右側に配置します
  • "bottom"elemanchor の真下に配置します

タスクソースコードで提供されている関数 showNote(anchor, position, html) 内で使用されます。この関数は、与えられた html で「メモ」要素を作成し、anchorposition で表示します。

メモのデモはこちら

タスクのサンドボックスを開く。

このタスクでは、座標を正確に計算する必要があります。詳細についてはコードを参照してください。

注意: 要素は、offsetHeight やその他のプロパティを読み取るためにドキュメント内に存在する必要があります。非表示 (display:none) またはドキュメント外にある要素にはサイズがありません。

サンドボックスで解決策を開く。