jquery - 在文本框上方或下方对齐弹出通知 (CSS/jQuery)

Question

我有一个密码重置页面 here每当用户在类 id="pswd_info" 的“新密码”文本框中键入时，它就会弹出一个 jquery 弹出窗口。

问题是弹出窗口覆盖了文本框。现在我将它锚定在页面底部，没有任何其他解决方案。当浏览器大小缩小时，这并不好，如下所示:

我应该探索什么技巧来将弹出窗口向下移动，或将“新密码”文本框向上移动？

Answer 1

您正在使用此 CSS:

right: 360px;

这会将弹出窗口定位在距页面右端 360 像素的位置。这将是有问题的，因为大多数用户有不同的屏幕宽度。 (通过调整浏览器窗口的大小来尝试一下)

要使用更通用的居中方法，请使用:

right:50%;
margin-right:-125px;

这会将它定位在中间。 margin-right 是弹出窗口全宽的一半，以补偿元素自身的宽度。

你的 bottom 属性也会有同样的问题，因此我建议使用 top 而不是 bottom。(加上你有 2 个不同的底部属性，一个有问题)