GSAP detector

GSAP logo

How can you detect if a website uses GSAP?

Detecting whether a website uses GSAP (GreenSock Animation Platform) can be done by examining the page source and looking for specific indicators related to GSAP.

Here’s a step-by-step guide on how to do it:

  1. Open the Page Source: Right-click on the webpage and select “View Page Source” or press Ctrl+U (Windows) or Cmd+Option+U (Mac) to open the page source code.
  2. Search for GSAP: Use Ctrl+F (Windows) or Cmd+F (Mac) to open the search function and look for the following keywords:
    • gsap: This is the primary keyword associated with GSAP. Look for lines like <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/gsap.min.js"></script>.
    • greensock: Sometimes, GSAP is referenced with its full name. Look for lines like <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/gsap.min.js"></script> or similar.
    • TweenMax or TweenLite: Older versions of GSAP include these keywords. Check for references like <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/TweenMax.min.js"></script>.
  3. Check for GSAP Initialization: Look for code snippets in the JavaScript section that initialize GSAP animations. You can find patterns like:
    • gsap.to(): This method is commonly used to animate properties of elements.
    • gsap.from(): This method is often used to appear animations.
    • gsap.timeline(): This is used to create a sequence of animations.
  4. Look for GSAP Plugins: GSAP has plugins that enhance its capabilities. Search for terms like:
    • ScrollTrigger: This is a popular plugin for scroll-based animations.
    • Draggable: This plugin makes elements interactive and draggable.
  5. Check the Console for GSAP Reference: Open the browser’s Developer Tools by right-clicking the page and selecting “Inspect” or pressing F12. Then select the “Console” tab and type window.gsap. If GSAP is present, it will return the GSAP object.
  6. Look for GSAP Animation Calls: Use the “Elements” tab in Developer Tools to check if there are animations applied to elements on the page. Right-click on an element and see if any GSAP classes are applied.