GSAP Line Drawing - Draw SVG strokes as you scroll Elementor pages

GSAP Line Drawing lets us fill in SVG strokes as users scroll our Elementor-designed pages, creating an effect that makes it look like the SVG is being drawn in real time along with the scrolling.
GSAP Line Drawing: gloo.ooo/modules/gsap-line-dr...
GSAP Scrolltrigger Overview: • GSAP Scrolltrigger - S...
GSAP Split Text Tutorial: • GSAP Split Text - Anim...
GSAP Pin Functions Tutorial: • GSAP Scrolltrigger - P...
GSAP Staggering & Manual Timeline: • GSAP Scrolltrigger - A...
All Gloo features are included in every single subscription. Try them all out for free at demo.gloo.ooo
Join our FaceBook Community of Gloo experts at / gloo4elementor
FaceBook: Gloo4elementor
InstaGram: gloo4elementor
TikTok: www.tiktok.com/@gloo4elementor
Twitter: gloo4elementor
LinkedIn: www.linkedin.com/company/80747386

[@bds219]

Hi. I’m in sandbox. 1) How do you get to Gloo settings at 2:38 mark and 2) in preview mode my svg line show html, not the line. Thanks

[@gloo4elementor]

Hi there! for the first point, i suggest you watch the gsap overview tutorial first, as the informations within are considered the basis to get started on line drawing and all the other GSAP events: kzbin.info/www/bejne/l5yzdYete7mMp7s That said, you can get to the GSAP settings by clicking on the Gloo icon on the top left corner of your elementor editor, which will in turn take you to the advanced tab of the page settings. There you'll be able to work on gsap. As per the second point, make sure you're exporting exactly as shown in the video! Let me know if that works, thanks!

[@bds219]

@@gloo4elementor Thanks. My specific initial use case will involve creating svg lines that are more scroll triggered as the user scrolls down the page.

[@gloo4elementor]

@@bds219 that's exactly what line drawing is for! let me know how we can help you further

[@razakahmad12]