1

好的，我正在尝试向现有页面添加一个元素，该元素将显示在一个按钮上方/下方，该按钮将打开/关闭它。这个元素触发器被添加到我正在添加它的页面的几个组件中。在大多数情况下，当它在触发元素下方打开时显示元素是可以的。然而。肯定有少数情况下，当切换打开时元素会下降到页面视图下方，假设用户没有一直向下滚动以补偿元素打开（他们为什么会这样）所以为了便于使用对于我的用户，我希望这个元素在它掉出查看窗格的情况下而不是在上面打开的触发器下方打开（UI 必须更改以补偿一点，以及触发器以图形方式连接到打开的框漂亮的流体外观，无论如何，那部分是无关紧要的，那是一种视觉魔法。它确定打开时元素是否在端口之外，如果是，则使其加载到触发器上方。

现在要避免显而易见的事情。“你做了什么”。好吧，没什么。使元素在下面对齐很容易我以前做过，我倾向于获取触发器位置，然后根据它的底部对齐元素以根据触发器位置进行匹配。所以，只是试图解决如何处理的问题，如果它超出端口甚至几个像素使其加载到触发器之上。我将如何补偿这样的事情是关键问题，是否有我可以遵循的特定技术，或者如果你愿意的话，我应该在这样做时考虑什么“魔法”？

4

2 回答 2

2

使用 jQuery，您可以将处理程序附加到.scroll()文档的。

通过该事件，您始终可以了解访问者正在查看的内容以及访问event属性.pageX和.pageY

现在你知道了你点击元素的位置.offset()和它的高度。

您还可以获得窗口对象和要显示的元素的高度。

那么这只是一个计算问题..

祝你好运

于 2012-10-19T20:20:52.317 回答
0

我解决这个问题的方法是：

  1. 为触发器和扩展/折叠元素添加一个容器，overflow:visible;并将容器设置为position:relative;
  2. 下一个（显然）将扩展元素设置为position:absolute
  3. 根据触发元素相对于屏幕的位置，设置扩展元素的 left 和 top 属性，将其定位在触发器的上方或下方。
于 2012-10-19T20:05:08.427 回答