ScreenshotNeo

BlogHow-to

How to Capture Full-Page Screenshots with FullPage.js

Capture fullPage.js sites reliably by accounting for sections, horizontal slides, nested scrolling, lazy-loaded assets, and image size limits.

By the ScreenshotNeo team4 October 20267 min read

Short answer: fullPage.js creates fullscreen scrolling websites; it does not capture screenshots. Use a browser’s full-page screenshot feature or a scrolling screenshot tool that stitches viewports. Before relying on the result, inspect every vertical section, horizontal slide, and nested scroll area: a fullPage.js page may not behave like one ordinary long document.

The official fullPage.js documentation describes a library for fullscreen scrolling websites, with optional landscape sliders. Its sections can fit the viewport and move automatically, while oversized section content can scroll inside the section. That behavior determines what a capture needs to include.

1. Understand what “full page” means on a fullPage.js site

A conventional full-page capture scrolls a document from top to bottom and combines the content. A fullPage.js site may instead present one viewport-sized section at a time, snap between sections, and include horizontal slides inside a section. A section can also contain more content than fits in its available height.

The library’s relevant controls include autoScrolling and fitToSection. For oversized section or slide content, it documents scrollOverflow. For nested elements such as a modal or overflowing text area, normalScrollElements can allow scrolling inside the specified element without triggering movement between fullPage.js sections. These describe site behavior; they are not screenshot options.

  • Sections: review every vertical section, not just the first viewport.
  • Horizontal slides: inspect each slide; scrolling down the page may not expose them all.
  • Overflow: separately inspect content that scrolls inside a section or nested element.
  • Dynamic content: wait for images and other lazy-loaded media to appear before capture.
  • Fixed and sticky elements: check whether headers, overlays, or other persistent elements are absent, repeated, or shown in an unexpected state.

The fullPage.js documentation identifies version 4.0.41 at the time covered by the research. Check its current documentation if you maintain the site or need version-specific behavior.

2. Choose a capture method

Method Useful when Check before relying on it
Browser-native full-page screenshot You want a direct image capture without installing an extension. Confirm the feature is available for the page and browser. Restricted browser pages may not be capturable.
Scrolling screenshot extension You need a tool that scrolls through successive viewports and stitches them. Check browser support, frame capture, export formats, and how it handles section snapping and nested scroll areas.
Capture sections separately A single output is truncated, too large, or misses slides and inner content. Keep section and slide order clear, then review the individual outputs.

Mozilla documents a Firefox full-page screenshot feature that saves a PNG. A Chrome extension listing in the research describes scrolling through a page, capturing successive screens, and stitching them, with PNG, JPEG, and PDF export listed. Browser features and extension capabilities can change, so check the current product documentation or listing before choosing a workflow.

3. Capture the page and inspect the result

  1. Open the site in the browser and let it render. If it loads images or other media lazily, scroll or otherwise wait until the assets you need have appeared.
  2. Choose the browser’s full-page screenshot feature, if available, or use a scrolling capture extension supported by your browser.
  3. For an extension, start the capture and let its scrolling and stitching finish. Avoid interrupting the process midway.
  4. Review the output from top to bottom. Account for each vertical section and horizontal slide, and inspect inner scrollable content separately.
  5. Check fixed headers, sticky elements, banners, and overlays for missing or repeated appearances. Confirm that lazy-loaded content is present.
  6. If the result is truncated or too large, use the tool’s supported splitting options or capture sections separately. Verify that the final set covers the content you need.

Do not assume that a single tall image necessarily represents every state of an interactive fullPage.js site. If the capture tool does not navigate horizontal slides or nested scroll areas, capture those states separately.

4. If you maintain the fullPage.js site

Use the library’s configuration and state controls to prepare a predictable capture sequence. The documentation describes sections and slides, automatic scrolling and viewport fitting, and callbacks and state information. These can help you determine which section or slide is active during a controlled capture.

First identify whether the content is a fullPage.js section, a horizontal slide, overflow within a section, or a separate nested scrollable element. The library documents scrollOverflow: true for content taller than a section or slide, and normalScrollElements for nested elements such as modals. They address different scrolling cases. Consult the official documentation for the configuration supported by your installed version; do not change site code if you do not own or maintain it.

5. Common problems and fixes

Symptom Likely cause What to do
Only the opening section appears The capture took the current viewport rather than scrolling the page, or section snapping interrupted the capture. Use a full-page browser feature or a scrolling capture tool, and inspect the output for every section.
A horizontal slide is missing The capture followed vertical scrolling but did not change the active slide. Capture each slide state separately if the tool cannot navigate slides.
Text or media inside a section is cut off The section has overflow content or the screenshot tool captured only its visible viewport. Scroll the section’s inner content and capture it separately, or use a tool that can handle the nested scroll area.
Images are blank or missing Lazy-loaded assets had not appeared before capture. Wait for rendering and make the relevant content load before taking the screenshot.
A fixed header or overlay appears multiple times A scrolling tool stitched multiple viewport captures while a persistent element stayed visible. Inspect the stitched image and use a capture option that handles fixed elements, if available, or capture sections separately.
The capture stops early or export fails The output may exceed a browser or tool’s image or canvas limits. Use supported split/export options or capture smaller sections. Limits vary by tool and browser; do not treat one vendor’s stated threshold as universal.
The browser cannot capture the page Some browser pages or restricted contexts do not allow screenshot capture, or an extension lacks access. Try the browser feature on the actual site, verify extension permissions and supported page types, or use a different capture route.

6. Output size, reliability, and practical trade-offs

A single very tall image is convenient to share, but browser and canvas size ceilings can prevent some captures or require splitting. The FullPage Capture help page describes dividing very large images once its stated Chrome canvas limits are exceeded; that threshold applies to that product and configuration, not all browsers or tools. Check the chosen tool’s current limits.

For reliability, capture after the page and its assets have settled, then inspect the exported file rather than assuming a completed capture is complete. For complex sites, separate captures of sections, slides, and overflow content can be easier to verify than one image. If you need a PDF or annotations, confirm that the selected browser feature or extension currently supports that output.

7. Or skip the browser setup

ScreenshotNeo is a website screenshot API and MCP server. A single GET request can return a screenshot or PDF; see the API documentation for the available parameters. For example, this cURL request saves a WebP screenshot of the target URL:

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

Equivalent Python:

import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
    timeout=90,
)
open("shot.webp", "wb").write(r.content)

Equivalent Node.js:

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
await Bun.write('shot.webp', new Uint8Array(await res.arrayBuffer()));

Replace the example URL with the site you need to capture. ScreenshotNeo removes cookie and consent banners, newsletter popups, and chat widgets before the shot; each cleanup step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits cost nothing, and response headers report the page verdict and billing status. Its MCP server provides take_screenshot, get_page_info, and capture_pdf tools for AI agents. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 screenshots.

Sign up for ScreenshotNeo’s free plan to get 1,000 screenshots a month with no card.

FAQ

Is fullPage.js a screenshot library?

No. It is a JavaScript library for fullscreen scrolling websites and optional horizontal sliders. Use a browser screenshot feature or separate screenshot tool to capture the rendered site.

Will one full-page capture include every slide?

Not necessarily. Horizontal slides are distinct states; check whether the capture tool visits them, and capture them individually if needed.

What should I do with a section that scrolls internally?

Inspect and capture its inner content separately if the screenshot tool only captures the section’s visible area.

Can I capture a very long page as one image?

Sometimes, but browser and tool image-size limits can require splitting the output. Check the current limits of the specific tool you use.