DriversRecommendedOutdated drivers can make a good PC feel brokenScan driver issues before chasing fixes manually.Scan NowOctober DealsAmazon USOctober deal check: compare before you payAmazon US: current deals, useful picks and tech finds.Check DealsPC HealthRecommendedCrashes, freezes, slowdowns? Check your PC nowSpot repairable issues before they interrupt work.Check PC×
Skip to content
World desk7 min

How to Capture CSS and JavaScript Animations as Images with Python Selenium

A practical guide to waiting for web animations, selecting and positioning a Web Animations API effect, and capturing the rendered result with Python Selenium.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

To capture a particular animation frame, use Selenium to load the page, wait for the target animation to be ready, and control it in the browser with JavaScript. If the animation is exposed through the Web Animations API, pause it or set its currentTime, then save a screenshot with Selenium’s Python API. For repeatable captures, use a known animation time and a stable viewport; merely waiting a fixed number of seconds is less dependable.

Choose the right capture method

Selenium captures the browser’s rendered state. Use driver.save_screenshot() for the current browsing context, or an element’s screenshot method when you only need one page element. Selenium’s Python screenshot API saves PNG image data. Selenium: working with windows and tabs · Selenium Python WebDriver API

  • Capture the current moment: wait for the desired visual state, then save a screenshot. This is simple, but elapsed time can vary between runs.
  • Pause the current animation position: use the Web Animations API’s pause() method, then capture.
  • Seek to a specific position: set the animation’s currentTime in milliseconds, then capture. This is more repeatable when the target animation supports it.
  • Capture one component: use the relevant element’s screenshot method rather than saving the entire current context.

These animation controls work only for animations represented by Web Animations API objects. JavaScript-driven motion is not guaranteed to appear in document.getAnimations(); if it does not, use the application’s own controls or state to reach the desired frame.

Install Selenium and prepare the browser

Install Selenium in the Python environment where the script will run:

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
#1 Best Overall
Amazon Basics 50-inch Lightweight Portable Camera Tripod Stand with Quick-Release Plate, Adjustable Height, Aluminum, for Travel Photography, Champagne
  • Camera mount tripod stand with zippered storage bag
  • Adjustable height from 16.1inch to 50inch with 3-section,lever-lock legs for simple adjustments
  • Folds down quickly and made of lightweight aluminum; It weighs only 1.23 lbs,lightweight and portable, easy to carry for travel,hiking,camping,etc
  • 3-way head allows for tilt and swivel motion;portrait or landscape options;Built in Bubble Level,fast and accurate positioning
  • Quick-release plate helps ensure fast transitions between shots
python -m pip install selenium

You also need a browser and a compatible WebDriver setup. The exact driver and browser configuration depends on your environment. The code below assumes driver is an active Selenium WebDriver session; create and configure it for your chosen browser before running the capture steps.

Wait for the page and target animation

A completed page load does not guarantee that a single-page app has rendered its content or started the animation you want. Wait for a page-specific element or condition before inspecting animations. For example, if the animated component has a stable CSS selector:

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait

WebDriverWait(driver, 20).until(
    lambda d: d.find_element(By.CSS_SELECTOR, ".animated-component").is_displayed()
)

Replace .animated-component with a selector that identifies the actual target on the page. If the element becomes visible before its animation is created, add a page-specific readiness condition rather than assuming visibility means the animation has started.

Rank #2
XXZU 75" Camera Tripod,Aluminum Tripod for Camera Phone/Monopod with Remote
  • 75in Extendable Camera Tripod: This tripod for camera phone can extend to a height of 75 inches by adjusting the flip locks, which can be quickly adjusted to any desired height to meet the needs of various shooting scenarios. Both the ball head and center column are equipped with level for easy real-time level calibration, ensuring perfectly level shots.Good Digital Camera Accessory Kits for you.
  • 3-in-1 Detachable Center Column: The center column supports quick detachment, allowing for flexible use as a monopod or selfie stick (Max Height:43.9 in / 111.5 cm). Camera phone tripod stand can also be installed upside down for low-angle macro shooting. This 3-in-1 multi-functional design simplifies shooting equipment, saves carrying space, and enhances practicality and cost-effectiveness, making it suitable for travelers, outdoor enthusiasts, and content creators.
  • 3-Level Angle Adjustment For Various Terrains: The camera tripod legs can be adjusted to three angles using the angle adjustment locks, allowing it to spread almost horizontally to achieve a minimum height of 15.35in(39cm) for low-angle shooting. Each leg adjusts independently in both angle and length, ensuring the tripod stand steadily on stairs, rocky trails, or uneven ground—making it ideal for outdoor-photographers and hikers shooting in unpredictable environments.
  • Remote Control & Flexible Ball Head: Equipped with a 360° ball head, which supports free rotation in both horizontal and vertical directions. When shooting vlogs or live streams, you can flexibly switch angles and landscape/portrait modes without moving the tripod. In addition, this phone tripod has a built-in remote control with a maximum 10m control distance. Whether it's selfies, group photos, or long-distance shooting, one-button control makes shooting easier and more convenient.
  • Sturdy & Stability: Constructed from aluminum alloy, this DSLR camera tripod features thickened tubes and anti-slip rubber feet that provide stronger grip on various surfaces, effectively preventing image shake. Its bottom hook allows for hanging weights, increasing counterweight and further enhancing overall stability, ensuring smooth footage even outdoors.[Max load 8kg/17.64lb (vertical) or 3kg/6.61lb(45° tilt)]

Find and position the animation

Inspect the page’s exposed animations and identify the intended one. Do not assume the first result is the right animation: a page can have several simultaneous effects. A reliable selector should use a known target element and, where possible, a property or other characteristic specific to the effect.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
animations = driver.execute_script("return document.getAnimations();")
print("Exposed animations:", len(animations))

WebDriver returns JavaScript results to Python; the returned animation objects may not be convenient to inspect or retain as ordinary Python objects. A practical approach is to identify and control the animation entirely inside one browser-side script. The following example selects animations associated with a page element, reports how many matched, and seeks the first match to 500 milliseconds:

result = driver.execute_script("""
const target = document.querySelector('.animated-component');
if (!target) return { error: 'Target element not found' };

const matches = document.getAnimations().filter(animation =>
  animation.effect && animation.effect.target === target
);
if (!matches.length) return { error: 'No exposed animation found for target' };

const animation = matches[0];
try {
  animation.pause();
  animation.currentTime = 500;
  return { matched: matches.length, currentTime: animation.currentTime };
} catch (error) {
  return { error: error.name + ': ' + error.message, matched: matches.length };
}
""")

if result.get("error"):
    raise RuntimeError(result["error"])
print(result)

The 500 value is an example position, not a universal frame number or duration. Choose a time that makes sense for the target effect. If the element has multiple animations, refine the selection in the page-specific script rather than silently capturing whichever happens to appear first. The Web Animations API documents pausing and setting the animation time in milliseconds: Animation.pause() and Animation.currentTime.

Rank #3
Sale
K&F Concept 64 inch/163cm Lightweight Aluminum Travel Camera Tripod
  • 【Lightweight and Portable】4 section leg can adjust tripod height from 20.4''/52cm to 64.1''/163cm; it can be folded to 15.5''/39.5cm to make it easy to put it in the carrying bag; the net weight with the ball head included is only 2.53lbs/1.15 KG.
  • 【360 Degree Ball Head】36mm ball head can be rotated to any angle you want, helping to improve the range of camera activity during panning. It can withstand up to 17.6lbs/8kg.The 360-degree panning dial lets you set up precision shots to capture the beauty of landscapes.
  • 【Efficient and Flexible】With powerful and quick flip leg lock, only use one hand can open and close all the buttons in a few seconds. It's very easy to use, saving you more time and can more focused on enjoying the shooting.
  • 【Versatile Ability】The center column inverted installation (also with a short center column) to achieve the lowest angling shooting, archery and special photography.
  • 【More Compatibility】This camera tripod with standard 1/4'' thread,which can be applied to most Arca-Swiss quick release plates; 1/4" screw is suitable for most cameras, DSLR camera, projector and telescope, etc.

Pausing all exposed animations can be useful for a quick diagnostic, but it is not selective and may freeze unrelated motion:

driver.execute_script("document.getAnimations().forEach(animation => animation.pause());")

pause() can raise InvalidStateError if the animation’s current time is unresolved and its end time is infinite. Handle that possibility for the specific page instead of assuming every animation can be paused or sought immediately. MDN documents this exception.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Save the screenshot

Capture the current browsing context

After positioning the animation, save the current browser context as a PNG:

Rank #4
VICTIV 74” Camera Tripod, Tripod for Camera and Phone with Phone Holder
  • 【74 Inch Tall Tripod and Compact Tripod】 This tall camera tripod has a height adjustment range of 19-74 inches. It can meet the needs of daily work. This compact tripod comes with a carrying bag for outdoor and indoor shooting. This compact tripod weighs 3.14 lbs / 1.4 kg and is easy to store and stow
  • 【Tripod for All Camera and Phone】Standard 1/4" screw mount compatible with all cameras ( Canon, Nikon, Fujifilm, Olympus, Panasonic), DSLR, SLR, and digital cinema cameras, also spotting scopes, projector, compact camcorders, binoculars. The 360° phone mount is compatible with iPhone 17 16 15 14 13 12 11 Pro/XS/XR/MAX/8/8 Plus/X/7 Plus/7/6s Plus/6s/6 Plus/6/Samsung Galaxy S22/ S21 Series/ Galaxy Z Flip/ NOTE/ One Plus 1+Series
  • 【Professional 3-Way Pan Head】VICTIV Professional camera tripod stand is equipped with a stable and smooth 3-way pan head, it allows 360° horizontal panoramic shots, 180° up and down shots, and 90° vertical portraits. Non-slip pads provide great grip. You can also hang a backpack on the weight hook for extra stability
  • 【Video Tripod for Photography】The video camera tripod is suitable for outdoor and indoor shooting. It can meet the daily shooting needs of video producers, video bloggers, and youtube users. Camera tripods for Photography, food shooting, live streaming, scenery shooting, and portrait shooting, etc
  • 【Complete Tripod Units】What You Get: 1X Tripod for cell phone and camera, 1X Universal Phone Holder, 1X Extra Quick Release Plate,1X 3-way Pan Head, 1X Handle, 3X Non-slip pads. Please contact us anytime if any questions
driver.save_screenshot("capture.png")

This captures the currently rendered browser state in the current browsing context. It does not establish a universal full-document screenshot recipe. Confirm the resulting image’s dimensions and appearance for the browser, page, viewport, and device scale you are actually using.

Capture only the animated element

If a component-only image is sufficient, capture the element itself:

element = driver.find_element(By.CSS_SELECTOR, ".animated-component")
element.screenshot("animation-element.png")

Use the element screenshot when the output should be limited to that element, rather than the whole current context. Selenium’s documentation includes Python examples for element screenshots. Selenium screenshot examples

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Best Value
Sale
CAMBOFOTO 74″ Camera Tripod, Phone Tripod for iPhone Lightweight Tripod
  • Adjustable 20″–74″ Height: Easily extend from tabletop to full height for portraits, vlogs, outdoor photography, travel shots, and events — perfect for photographers and content creators of all levels.
  • Heavy Duty & Stable: Durable aluminum legs support up to 8.8 lbs, so it can take DSLRs, mirrorless cameras, ring lights, GoPros, and smartphones securely without wobble.
  • Multi-Device Compatibility: Includes quick release plate & phone mount — switch effortlessly between camera and phone setups for photos, live streams, podcasts or video calls.
  • 360° Pan & Tilt Head: Smooth, fluid head movement lets you capture wide panoramas, dynamic video clips, and precise compositions without stiff dragging.
  • Travel Ready & Lightweight: Weighing only 2.8 lbs and folding compactly for storage, this tripod is built for backpacks, road trips, hikes, and everyday use. Includes carry bag for convenience.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Make captures more repeatable

  • Wait for a meaningful condition: wait for the component and animation to exist, not just for navigation to complete.
  • Use explicit animation positioning: setting a known currentTime avoids relying on how quickly the page happened to animate after navigation.
  • Keep the viewport consistent: responsive layout changes can alter the rendered result. Configure the browser window consistently before capturing.
  • Choose the scope deliberately: save the current context for a page view, or use an element screenshot for a component crop.
  • Check the output: inspect dimensions and visual state on the browser and page you intend to automate. The cited general Selenium screenshot methods do not guarantee identical results across all browsers or provide a universal full-page capture method.

If you need browser-specific control beyond standard WebDriver methods, Selenium’s Python API exposes execute_cdp_cmd for Chrome DevTools Protocol commands. That approach deliberately accepts Chrome-specific behavior and should not be confused with portable WebDriver APIs. Selenium Python WebDriver API

Troubleshoot common failures

  • No animation is found: the animation may not have started, the selector may not identify the animated element, or the effect may not be exposed through the Web Animations API. Wait for the page’s real ready state, verify the target selector, and use app-specific controls if needed.
  • The wrong effect is frozen or captured: the page may expose multiple animations. Filter by the intended element and refine the selection instead of using the first result or pausing every animation.
  • Seeking raises an error: inspect the error returned by the browser-side script. An unresolved current time combined with an infinite end time can cause InvalidStateError; wait until the relevant animation is active and handle its state explicitly.
  • The screenshot shows the wrong moment: ensure the positioning script runs after the target animation exists, and set a known time rather than depending on a fixed sleep alone.
  • The image omits content or has unexpected dimensions: check whether you used an element screenshot or current-context screenshot, and verify the browser viewport and output image. Do not assume the current-context method captures a full document.
  • The result differs by browser: use standard WebDriver methods where portability matters. If using Chrome DevTools Protocol commands, account for their Chrome-specific nature.

Or skip the browser setup

ScreenshotNeo is a screenshot API and MCP server for developers. A single GET request can return an image or PDF. Its API can capture pages directly, while its MCP server offers take_screenshot, get_page_info, and capture_pdf tools for AI agents using Claude, Cursor, or another MCP client. It is an alternative when you need a page capture without configuring Selenium and a browser session yourself. It does not replace Selenium’s browser-side animation controls for seeking a particular frame; use it when a direct page screenshot is what you need.

Example cURL request (substitute the URL to capture and your API key):

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

See the ScreenshotNeo API documentation for request options. Cookie banners are accepted and removed, along with known consent platforms, newsletter popups, and chat widgets, before the shot; those cleanup steps can be turned off. Bot checks, blank pages, and failed loads are not billed. One thousand screenshots a month are free with no card, and paid plans start at $5 for 3,000. Learn about ScreenshotNeo, or sign up for 1,000 free screenshots a month with no card.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Frequently Asked Questions

Can Selenium control every JavaScript animation?

No. Selenium can execute browser-side JavaScript, but only animations represented by Web Animations API objects can be controlled through `document.getAnimations()` and the API’s pause or time-setting methods. Other motion may require application-specific controls.

Does `save_screenshot()` create a full-page image?

It captures the current browsing context. The documented method does not provide a universal full-document screenshot recipe; use and verify the capture method that matches your required scope.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Leave a Reply

Your email address will not be published. Required fields are marked *

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

More from the Wire

  1. Shenzhen desk3 min
    HONOR Expands Beyond Smartphones With Humanoid Robot RevealHONOR said it unveiled its first humanoid robot at MWC 2026 and named shopping assistance, workplace inspections, and supportive companionship as intended uses. Later Robotics D1 claims and a reported…
  2. Cupertino desk5 min
    Apple Unveils AirPods Max 2: The Upgrade That Should Have Happened Years AgoAirPods Max 2 adds H2-powered audio features and Apple claims up to 1.5× more effective ANC, but its design, Smart Case, and 20-hour battery rating are unchanged. Wired lossless audio…
  3. Cupertino desk4 min
    Apple’s OLED Touch MacBooks Are Coming—but the Dynamic Island Is the Real GambleApple has not announced an OLED touchscreen MacBook, but reports point to high-end models arriving in late 2026 or early 2027. The reported Mac Dynamic Island could be useful, but…
Recommended PC Tool
Recommended PC Tool
PC Slower Than It Used to Be?Free scan - under a minute
Crashes, No Sound, or Screen Glitches?Free driver scan

Two free Windows tools

One Free Minute Could Fix That PC

Before you go - each of these free tools takes about a minute and tackles what quietly slows a Windows PC down.

Special offer. View Outbyte info, uninstall instructions, EULA, and Privacy Policy.