Jump to content
Search Community

AlexanderPohl

Members
  • Posts

    7
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

AlexanderPohl's Achievements

  1. Over the source code i found out that the normal gsap-plugin loads at line 147 and the scrolltrigger-plugin loads at line 1435. So i removed ", array('gsap-js')" from the code in the functions.php so that it looked like this: function enqueue_my_custom_script() { wp_enqueue_script( 'gsap-js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js', false ); wp_enqueue_script( 'gsap-st', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js', false, true ); } add_action( 'wp_enqueue_scripts', 'enqueue_my_custom_script' ); and now its working fine!
  2. <div class="boxtest2"></div> <script> ScrollTrigger.defaults({ markers: true }); gsap.registerPlugin(ScrollTrigger); gsap.to(".boxtest2", { scrollTrigger: ".boxtest2", x: 500, rotation: 360, duration: 5 }); </script> I typed it in like this but there is no markers showing up. I feel like ScrollTrigger isnt installed on my website since the markers wont even show up but i dont know what else to type into the functions.php other than the code i already have.
  3. Hello, i successfully installed gsap too my wordpress website. Now i wanted to implement scrolltrigger into it as well. This is my functions.php: <?php // Exit if accessed directly if ( !defined( 'ABSPATH' ) ) exit; /** * Child theme functions */ if ( !function_exists( 'rewon_child_theme_css' ) ): function rewon_child_theme_css() { wp_enqueue_style( 'rewon_child_theme_CSS', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css'); } endif; add_action( 'wp_enqueue_scripts', 'rewon_child_theme_css', 99 ); function enqueue_my_custom_script() { wp_enqueue_script( 'gsap-js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js', false ); wp_enqueue_script( 'gsap-st', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js', array('gsap-js'), false, true ); } add_action( 'wp_enqueue_scripts', 'enqueue_my_custom_script' ); and this is my code on the page i wanted to testing the plugin: <div class="boxtest2"></div> <script>gsap.registerPlugin(ScrollTrigger);gsap.to(".boxtest2", { scrollTrigger: ".boxtest2", x: 500, rotation: 360, duration: 5 });</script> If i take out "gsap.registerPlugin(ScrollTrigger);" then the animation is working but not with scrolltrigger. Is the code in the functions.php right?
  4. Hello, thanks for all the replys! I followed the video and now its working, im so happy! https://pscaring.de/gsap-test/
  5. Could i just copy and paste this code into the functins.php without making any adjustments in the code? And where exactly do i have to paste the "DOM-Code" into?
  6. Did you mean like this? unfortunately this didnt work for me. Or the box didnt move at least.
  7. Hello, im very new to this and my englisch is also not the greatest. Im having problems "installing" gsap to my wordpress website. On my website i have a theme called "rewon" installed. After watching multiple videos and guides i ended up with this code in my funcions.php which looks like this: Im not even sure if this is implemented correctly. when trying to recreate the "first animation" in the learning tab from gsap, i ended up having a code like this: When previewing the page, there is only the black box getting displayed but without any animation. When checking the console there's a line saying: "Uncaught ReferenceError: gsap is not defined".
×
×
  • Create New...