web-dev-qa-db-ja.com

ユーザーが背後の領域をスクロールした場合、ポップアップは閉じられるべきですか?

下の画像では、サイドバー(Blue)は、入力フィールド、チェックボックス、およびcolor-picker(黄色)。ユーザーがカラーピッカーボタンをクリックすると、ポップアップダイアログが表示されます(緑)

このポップアップは自動的に閉じるユーザーの場合スクロールエリアその背後(blue)、またはアプリケーションのページのサイズが変更されたとき?

はいの場合、この動作はユーザーの期待に応えますか?これにより、ユーザーはコントローラー(カラーピッカー)にフォーカスを失うことになりますか?

Illustration

4
Simon

問題を回避し、スクロール可能なコンテナ内にカラーピッカーを埋め込むことができますか?ユーザーが「ポップアップボタン」をクリックすると、コンテナ内のカラーピッカーが展開されます。ユーザーがもう一度ボタンをクリックした場合、または色が選択された場合は折りたたむことができます。 enter image description here

モーダルポップアップが表示されると、ユーザーは明示的に閉じるか、クリックして離れるまで、そこにとどまることを期待します。コンテナー内にピッカーを埋め込んだ場合、それはモーダルとして表示されず、ユーザーはそれを閉じる必要があるとは感じません。

3
Jaco Briers

カラーピッカーのポップアップを自動的に閉じないでください!

それはユーザーの期待に対してです。ユーザーはクリックして開いており、クリックして閉じることを期待しています


背後でのスクロールに関する質問:

  • カラーピッカーポップアップブロックコンテンツ、特にユーザーを上下にスクロール。ただし、ユーザーscrollの場合、ページのスクロールのみを期待し、スクロールを閉じることを期待しません。ポップアップし、ページをスクロールします。ユーザーは、このポップアップがクリックするまで開いたままであることを期待します- 閉じるボタン/アイコンまたは-場合によっては-その外側をクリックします。

  • ポップアップデザインでもポップアップを閉じることができます。このデザインにより、ユーザーは開いたポップアップをやさしく強制的に閉じます。**例として、MSペイントのカラーピッカーを取り上げます。ユーザーは色を選択し、OKボタンをクリックして確定する必要があります。確認すると、ポップアップが閉じます。

enter image description here

可能な場合、Jacoのアイデア:「スクロール可能なコンテナ内にカラーピッカーを埋め込む」は、この問題を回避するための優れたアイデアです。

1
Mo'ath