尝试将元素滚动到视口的中心答案

【问题标题】：Attempt to scroll an element to the centre of the viewport尝试将元素滚动到视口的中心
【发布时间】：2016-05-25 01:55:10
【问题描述】：

我正在使用 watir-webdriver gem，最近在尝试单击 Firefox 上的某些元素时停止了。

当尝试单击超出视口的元素时，页面会滚动并将该元素放置在页面顶部。这基本上就是：

require 'watir-scroll'
element = @browser.div({:id=>'potatoes'})
element.wait_until_present
@browser.scroll.to(element)
element.click

或

$("div[id='potatoes']").scrollIntoView();

但是，这给我带来了一些问题，因为我在页面顶部运行了一个覆盖横幅，这反过来又导致元素在它“后面”。有没有一种简单的方法可以尝试滚动到某个元素，但不是将其放在视口的顶部，而是尝试将其居中。

另外我用过：

$("div[id='potatoes']").scrollIntoView(false);

滚动到元素并将其放置在页面底部，但最好将其居中，以防我想在页面底部放置横幅。

问候

【问题讨论】：

【解决方案1】：

IE & Firefox 实现elementScrollBehavior。它是为整个驱动程序会话的所有元素设置的。其中0 是默认设置，将元素放置在视口的顶部，1 将元素滚动到视口的底部。

caps = Selenium::WebDriver::Remote::Capabilities.firefox('elementScrollBehavior' => 1)
Watir::Browser.new :firefox, desired_capabilities: caps

要获得更多控制，您需要使用 javascript（Watir 可能应该研究对滚动到元素偏移量的更直接支持）。

browser.execute_script('javascript:window.scrollBy(250,350)')

【讨论】：