Hover over elements before taking screenshots
⚠️ We highly recommend reading steps 1 to 3 of Click any element on the page before taking a screenshot before going through this article. This will help you understand how to get selectors for the elements you want to hover over. Once you have that selector copied, proceed to the next step.
For this example, we are going to hover over the "Products" menu of AWS website so that we can see all their products before taking a screenshot. The arrow in the picture below shows the element that we want to hover over (it can be any element on the page). The webpage before hovering over the "Products" menu looks like this:
Note: Read the recommended article above to get the selector of the element you want to hover over
At this point, head over to your Stillio account, add this URL - AWS website, and turn-on the expert mode option. Where you see Hover, paste the selector you had copied earlier. It should look something like this:
Adding this webpage with the current settings will cause our render engine to hover over the selected element and hence render it like this:
Congrats! 🎉🎉🎉 Now we have successfully hovered over the "Products" menu before taking our screenshot. Again, you can hover just about any element on your webpage.