web-dev-qa-db-ja.com

ドラッグアンドドロップの小さな画面の代替とは何ですか?

全画面表示でよく見えるドラッグアンドドロップの質問がありますが、電話画面の場合は縮小できません。ページは上から下に移動し、進むにつれてさまざまな知識チェックがあります。

drag and drop - full screen

これは全画面の画像です。これには4つの列があり、ウィンドウのサイズが小さくなると、3つ、2つ、および1つにスナップされます。しかし、電話で質問がある場合は、1つの列に表示され、次のようになります。

drag and drop - one column

これは、答えの1つを下から上にあるスペースの1つにドラッグしたい場合、長いスクロールアップが必要になることを意味します。

このレイアウトに代わるものは、小さい画面で機能します。現在、画面サイズが変化したときに回答セクションを水平方向にスクロールできるようにすることを検討しています。下の画像のようなもの。

enter image description here

灰色の領域は左右にスクロールでき、白い領域は上下にスクロールできます。これをレイアウト/操作するより直感的な方法はありますか?

1
firefields

私はこのようなことを考えています:

enter image description hereenter image description hereenter image description here

これは パイ(円形または放射状)メニュー から着想を得ています。
enter image description here

2