プルダウンメニューやホバー時のメニューをデモに含めるには、以下の方法があります。
クリック時のみ表示されるプルダウンメニューや、ホバー時に表示されるメニュー等をPLAINERのデモコンテンツとして作成するには、いくつかの方法があります。それぞれ難易度が異なるため、状況に応じて使い分けることをお勧めします。
1. スクリーンショット機能の活用(推奨)
これが最も簡単で確実な方法です。
ホバーメニューが表示されている状態のスクリーンショットを撮影します。
PLAINERのスクリーンショットからデモを作成する機能を利用し、撮影した画像をアップロードします。
これにより、ホバーメニューを含む画面全体を画像としてデモ化できます。
2. ガイドの中に画像として挿入する
プルダウンメニューやホバーメニューを部分を簡易的に見せる場合に有効な方法です。
プルダウンメニューやホバーメニューのスクリーンショットを撮ります。
ガイドのテキスト入力欄に、撮影した画像を貼り付けるか、画像ボタンからアップロードします。
こうすることで、ガイド内に画像としてホバーメニューを表示できます。
▼設定イメージ
3. 高度なHTML編集(上級者向け)
HTMLやCSSの知識が必要なため、難易度は高いですが、より柔軟な表現が可能です。
クリックやホバーする要素を、PLAINER編集画面でクリックして、画面右側の「高度な編集」から「HTML編集(β)」を開きます。
クリック時やホバー時のみに表示されるメニューを常に表示するように、HTML/CSSを編集します。
これにより、ユーザーが実際にクリックやホバー操作をしなくてもメニューが表示されるデモを作成できます。
なぜプルダウンメニューやホバーメニューがデモでそのまま表示されないのか
PLAINERは実際の画面を再現する仕様のため、クリック時やホバー時にのみ現れるメニューは、デモ画面でも同様にクリックやホバー操作をしないと表示されない場合があります。
そのため、お手数をお掛けいたしますが、上記のような工夫が必要になります。

