jquery - 将下拉元素与绝对位置对齐

Question

我正在尝试创建一个简单的下拉框，就像在 Twitter 中一样:

https://about.twitter.com/products (点击语言项)。

为此，我使用以下 HTML:

<a href="#language">English</a>
<div class="popup" id="language">
  <ul>
    <li>Portuguese</li>
    <li>English</li>
    <li>French</li>
  </ul>
</div>

示例:http://codepen.io/mdmoura/pen/upIjv .

我会:

1 - 与他们的链接触发器对齐的下拉菜单；

2 - 能够将下拉菜单左对齐或右对齐到它们的触发器。

我该怎么做？

谢谢你，米格尔

Answer 1

将“相对”类应用于您的触发器 (.popup{ position: relative; };) 并将绝对类应用于下拉列表 (.popup ul{ position: absolute; })。然后，您可以使用 left:、right; 等在触发器的范围内移动下拉列表。