Jump to content
Search Community

Lauran999

Members

  • Posts

    4

  • Joined

  • Last visited

Recent Profile Visitors

2,257 profile views

Lauran999's Achievements

0

Reputation

  1. Lauran999
    I simply cannot figure it out, I tried adding/removing different dependencies in the functions.php file. But it seems like it only wants to work when the script is added in the header.php... Could you give it a check: http://www.bakkershuysje.nl/blog/ ? Does it have to do with this: "Probably the biggest update in ScrollMagic 2.0 is the new file structure and the removal of all dependencies (GSAP or jQuery)." (Link: https://ihatetomatoes.net/whats-new-scrollmagic-2-0/ ) Thanks Lauran
  2. Lauran999
    Hi Rodrigo, Thanks again for your quick reply:) 1. I tried the HTML <script> option: IT WORKED:D Again a step closer to the solution:) Now I am really certain that the script is not being loaded through enqueueing/registering in the functions.php.. I added this to the header.php fyi: <!DOCTYPE html> <?php global $smof_data, $woocommerce; ?> <html class="<?php echo ( ! $smof_data['smooth_scrolling'] ) ? 'no-overflow-y' : ''; ?>" xmlns="http<?php echo (is_ssl())? 's' : ''; ?>://www.w3.org/1999/xhtml" <?php language_attributes(); ?>> <head> <!--START LAURAN--> <script type='text/javascript' src='http://bakkershuysje.nl/blog/wp-content/themes/Avada/assets/js/1lauran/TweenMax.min.js?ver=3.8.4'></script> <!--END LAURAN--> 2. I checked the route to the js asset: That looks completely fine.. 3. I set up a test website, (it is working now because I left the HTML <script> tag in the header.php. You can take a look if you like;) http://www.bakkershuysje.nl/blog/ Tomorrow I will do some more testing and then I will get back here! Lauran
  3. Lauran999
    Dear Rodrigo, First of all thank you for your quick reply. I highly appreciate it! I tried several things: 1. Typing window.TweenMax in the firebug console resulted in the following message: window.TweenMax undefined But if I look at the html source code, I can see all scripts being listed in the footer in the right order (as enqueued in the functions.php file). So that looks strange. 2. Indeed in can have to do with dependencies. I am trying out several things with that atm. 3. I was reading here: https://codex.wordpress.org/Function_Reference/wp_enqueue_script about $depts, it says the following which I do not completely understand: Do you know if this has to do with it? So that it might have to do with not registering when you are writing it as a dependency of another script?! Do you have a suggestion? Thanks! Lauran
  4. Lauran999
    Dear All, I am using the Avada theme + ScrollMagic, but I get this following error in the console in Firefox: ReferenceError: TweenMax is not defined In the theme's functions.php I am trying to enqueue the scripts and add/delete dependencies, but I still can't get it to work: wp_enqueue_script( 'jquery', false, array(), $theme_info->get( 'Version' ), true ); //LAURAN BEGIN//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// //wp_deregister_script( 'TweenMaxMin' ); wp_register_script( 'TweenMaxMin', $template_directory . '/assets/js/1lauran/TweenMax.min.js', array(), $theme_info->get( 'Version' ), true ); wp_enqueue_script( 'TweenMaxMin' ); //wp_deregister_script( 'ScrollMagic' ); wp_register_script( 'ScrollMagic', $template_directory . '/assets/js/1lauran/ScrollMagic.js', array(), $theme_info->get( 'Version' ), true ); wp_enqueue_script( 'ScrollMagic' ); //wp_deregister_script( 'animationGsap' ); wp_register_script( 'animationGsap', $template_directory . '/assets/js/1lauran/plugins/animation.gsap.js', array(), $theme_info->get( 'Version' ), true ); wp_enqueue_script( 'animationGsap' ); //wp_deregister_script( 'debugAddIndicators' ); wp_register_script( 'debugAddIndicators', $template_directory . '/assets/js/1lauran/plugins/debug.addIndicators.js', array(), $theme_info->get( 'Version' ), true ); wp_enqueue_script( 'debugAddIndicators' ); //wp_deregister_script( 'lauranScrollMagic' ); wp_register_script( 'lauranScrollMagic', $template_directory . '/assets/js/1lauran/lauranScrollMagic1.js', array(), $theme_info->get( 'Version' ), true ); wp_enqueue_script( 'lauranScrollMagic' ); //LAURAN EINDE///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// And this is my script: //jQuery(document).ready(function($){ jQuery(document).ready(function(){ // place custom JS here console.log("DOM ready"); // window, links, and other assets loaded jQuery(window).on("load", function(){ // or place custom JS here to make sure DOM is ready and the window is loaded console.log("window, links, and other assets loaded"); var images = [ "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_01.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_02.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_03.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_04.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_05.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_06.png", "http://blabla.com/wp-content/themes/Avada/img/example_imagesequence_07.png" ]; // TweenMax can tween any property of any object. We use this object to cycle through the array var obj = {curImg: 0}; // init controller // create tween var tween = TweenMax.to(obj, 0.5, { curImg: images.length - 1, // animate propery curImg to number of images roundProps: "curImg", // only integers so it can be used as an array index repeat: 3, // repeat 3 times immediateRender: true, // load first image automatically ease: Linear.easeNone, // show every image the same ammount of time onUpdate: function () { $("#myimg").attr("src", images[obj.curImg]); // set the image source } } ); var controller = new ScrollMagic.Controller({loglevel: 3}); // build scene var scene1 = new ScrollMagic.Scene({triggerElement: "#imagesequence", duration: 220}) .setTween(tween) .addIndicators() // add indicators (requires plugin) .addTo(controller); var scene2 = new ScrollMagic.Scene({triggerElement: ".box2"}) .setTween("#animate1", 0.5, {backgroundColor: "green", scale: 2.0}) // trigger a TweenMax.to tween .addIndicators({name: "1 (duration: 0)"}) // add indicators (requires plugin) .addTo(controller); var scene3 = new ScrollMagic.Scene({triggerElement: '#containerLauran',duration: 300}) .setPin('#blockLauran') .addIndicators() .addTo(controller); var scene4 = new ScrollMagic.Scene({triggerElement: '#containerLauran2',duration: 200}) .setPin('#blockLauran2') .addIndicators() .addTo(controller); }); }); All scripts seem to have been added/enqueued correctly if I check the html structure with the Firefox inspector. All scripts are added in the right order as enqueued in the functions.php file of the WP-theme. Can someone help me out? It looks like if I am almost there... Thanks! Lauran
×
×
  • Create New...