寻找网站上下拉列表/菜单的替代方案或改进

发布于 2024-07-07 22:56:55 字数 403 浏览 9 评论 0原文

下拉列表、菜单和组合框都是非常常见的用户界面元素。 用户习惯于在本机应用程序(有时甚至是 Web 应用程序)中看到这些元素,但它们存在一些问题。

  1. 你必须瞄准鼠标。 有些菜单在鼠标移开时会折叠,有些菜单还包含子菜单,您必须瞄准才能展开。

  2. 如果不先瞄准鼠标,您将无法看到选项。

这些是困扰我的主要问题,也许其他人也注意到其他问题。 如果可以的话,我通常根本不使用下拉菜单。

问题是我有时想在有限的空间内呈现一长串选项。 问题 2 是我愿意做出的牺牲,但我想知道是否有人有任何技巧可以使这些下拉菜单更易于使用。 也许有人发明了一种新的列表控件样式。

我确信,如果这些类型的控件让我烦恼,那么它们也会让我网站的用户更加烦恼。

Drop-down lists, menus and combo boxes are all very common user interface elements. Users are accustomed to seeing these elements in native applications and sometimes web apps, but there are a few problems with them.

  1. You have to aim the mouse. Some menus collapse when you mouse out, and some have submenus that you have to aim at to expand.

  2. You can't see the options without aiming the mouse first.

These are the main things that trouble me, maybe other people notice other issues as well. I normally don't use drop-down menus at all if I can help it.

The problem is that I sometimes want to present a long list of options in limited space. Issue 2 is a sacrifice I'm willing to make, but I'm wanting to know if anyone has any tricks to make these drop menus easier to use. Maybe someone has invented a new style of list control.

I'm sure that if these types of controls annoy me, then they annoy users of my site more.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

流年里的时光 2024-07-14 22:56:55

嗯..关于下拉列表的另一件事让我烦恼的是,当它随文本扩展时无法控制它们的宽度(或者是我不知道的东西?)。

作为替代方案,我考虑了一个小弹出窗口,它最初以字母索引的形式显示可用选项列表,当用户单击字母链接时,它会显示可供选择的相关选项。 这将减少可供选择的选项。

同样,我们可以使用 ajax 在用户输入时动态构建选项。

Hmm..one more thing which annoys me about the dropdown list is the inability to control their width as it expands with the text (or is their something which I am unaware of ?).

For an alternate, I think about a little popup which initially displays a list of available options in form of Alphabetic index and when the user clicks on an alphabet link, it displays the relevant options to select from. This will reduce the options to select from.

On the same terms, we can use ajax to build the options on the fly as user types in.

醉梦枕江山 2024-07-14 22:56:55

您可以尝试 Mac OS/X 的任务栏,类似于 YouTube 中的选择栏。 我认为常用术语是气泡条,其中当鼠标滚动到小图像上时,小图像会变大,但会缩小到当鼠标不在控件上时所有项目都可见的大小。

You could try something like Mac OS/X has for its taskbar, similar to the selection bar in YouTube. I think the common term is a bubble bar where small images animate larger as the mouse rolls over them, but shrink back down to such a size that all items are visible when the mouse is not over the control.

ゃ人海孤独症 2024-07-14 22:56:55

@Nrj
width='20px' 将使折叠的下拉菜单保持 20px 的宽度。 问题是,Inernet Explorer 也会显示具有此宽度的展开项目,而到目前为止我遇到的所有其他浏览器都会显示完整的菜单。

@Nrj
width='20px' will keep the collapsed drop down at a width of 20px. Problem is, Inernet Explorer shows the expanded item with this width also, while all other browsers i met so far will show you the full menu.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文