Question

我正在使用watir-webdriver gem并且最近在尝试点击firefox上的某些元素时停止了。

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

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

OR

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

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

另外我用过：

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

滚动到元素并将其放在页面底部，但如果我想在页面底部放置横幅，那么将它置于中心会很不错。

此致

Answer 1

IE＆amp; Firefox实现<div class="container-fluid"> <div class=" left-side col-md-6"> <div class="page inside"> <h1>This Is A Title</h1> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> </div> <div class="page inside"> <h1>This Is A Title</h1> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> </div> <div class=""> <p class="">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum sollicitudin magna in aliquam hendrerit. Duis facilisis ipsum in scelerisque convallis. Vestibulum eget vehicula arcu. Suspendisse viverra accumsan euismod. Maecenas ac felis at mi pellentesque porta. Vestibulum sed metus et enim molestie sodales. Etiam auctor magna ac tincidunt dignissim. </p> <p class="">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum sollicitudin magna in aliquam hendrerit. Duis facilisis ipsum in scelerisque convallis. Vestibulum eget vehicula arcu. Suspendisse viverra accumsan euismod. Maecenas ac felis at mi pellentesque porta. Vestibulum sed metus et enim molestie sodales. Etiam auctor magna ac tincidunt dignissim. </p> </div> </div> <div class="middle-side col-md-3"> <div class="page"> <h1>This Is A Title</h1> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> </div> <div class="page"> <h1>This Is A Title</h1> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> </div> <div class="page"> <h1>This Is A Title</h1> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> <div class="page-text"> <p>This is the price <span>$735</span></p> </div> </div> </div> </div>。它为驱动程序的整个会话的所有元素设置。其中elementScrollBehavior是默认值并将元素放在视口顶部，0将元素滚动到视口底部。

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

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

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

1 个答案: