Question

我们有一个完美适用于所有现代浏览器的页面除了Microsoft Edge上的几个奇怪行为外。这是URL：

http://www.oru.edu/online/

向下滚动到下面的部分＆＃34;获得完全认可的在线学位......＆＃34;然后单击其中一张照片或其中一个学位名称。预期的行为是针对＆＃34;细节＆＃34;向下滑动的部分和使用jQuery＆＃34; slideDown＆＃34;向下滚动到它的窗口然后是＆＃34; animate＆＃34;。动画在所有经过测试的浏览器中运行良好。

下面的详细信息部分应该包含左侧度数的描述，右侧有四个矩形可点击区域：＆＃34;程序描述＆＃34;，＆＃34; Degree＆＃34;的好处，＆＃34;职业展望＆＃34;和＆＃34;学位计划＆＃34;。此外，细节区域的背景应包含您可能单击以打开它的图片的模糊版本。

所有jQuery动画（slideDown，slideUp，animate等）都在MS Edge中工作，但是当细节区域向下滑动时，有时（随机地，似乎）四个可点击矩形中的一个或多个直到你将鼠标悬停在它上面。

同样在不可预测的时间间隔内，背景图像仅显示div的一部分，其余部分为纯蓝色。

我尝试更改jQuery事件的顺序，我已经研究过对CSS的可能更改，我已经在两台完全独立的Windows 10计算机上尝试过了，我可以＆＃39;似乎找到了导致这种情况发生变化的任何事情。

感谢任何解决方案或想法！

Answer 1

我可能有一个关于jQuery中滚动问题的解决方案。没有承诺，但我确实有类似的问题，因为除了一个浏览器之外，每个浏览器都有一个自动滚动问题。解决方案非常小，我无法相信有一件事会造成如此大的问题。

没有看到你的jquery代码，我不知道这是否是实际的解决方案，但是这里......

你的jquery的动画部分中是否有一段代码看起来像这样？

$("html body").animate({
  scrollTop: $("#" + sectionID).offset().top
}

当然，你的代码可能不是以“html body”开头，也不是以“scrollTop”作为确切的术语，但这就是重点。

代码的“html body”部分之间需要有一个逗号。换句话说，像这样......

$("html, body").animate({
    scrollTop: $("#" + sectionID).offset().top
}

正如我所说，您的代码可能指向您网站的不同div或元素，而不是我的代码示例所示，但这个概念仍然适用。

这个小小的逗号可能会阻止你的动画在Edge工作。这就是发生在我身上的事。在我正在构建的网站中，我最初没有逗号，它可以在每个浏览器中工作，除了Edge之外，我可以使用它。我在这个问题上花了一个星期!!!!最后，我偶然发现了一个提到逗号和BAM的论坛！

试一试，请报告您的结果。祝你好运！

使用jQuery slideDown显示父级时，Microsoft Edge中的子元素不可见

1 个答案: