question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to add plugins like addIndicators?

See original GitHub issue

I try to add indicators using this plugin via NPM, tried importing and adding addIndicators to the controller as option in new ScollScene, but this isn’t working, also tried to add to scene but not working too.

I imported the addIndicators plugin as a require, maybe that’s the issue?

import {ScrollScene} from 'scrollscene';
import {gsap} from 'gsap';

require('scrollmagic/scrollmagic/minified/plugins/debug.addIndicators.min');

const myTimeline = gsap.timeline({paused: true})
   .from($(this).find('.element'), {
     duration: 0.8,
     delay: 0.5,
     opacity: 0,
   });

new ScrollScene({
    triggerElement: this,
    scene: {
      addIndicators: {
        name: 'sdffds',
        colorEnd: 'blue',
      },
    },
    controller: {
      addIndicators: true,
    },
    gsap: {
      timeline: myTimeline,
    },
});

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:9 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
RemyyBcommented, Feb 10, 2020

@jonkwheeler thank you, the plugin seems to be working correctly, thank you very much! Cheers!

1reaction
jonkwheelercommented, Feb 8, 2020

@RemyyB no sweat dude. I think in a future release I would like to make a more compatible version but this probably will hold you off for now. Let me know how it works.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How do I load the indicators plugin? - Stack Overflow
Look into this path scrollmagic/scrollmagic/uncompressed/plugins . You will find debug.addIndicators.js . You need to import this file. – Vishal ...
Read more >
Source: plugins/debug.addIndicators.js - ScrollMagic
This plugin was formerly known as the ScrollMagic debug extension. * * It enables you to add visual indicators to your page, to...
Read more >
scrollmagic import animation.gsap and debug.addIndicators
Importing Scrollmagic without using the script but the import method made me struggle for a while. Missing plugin error, or the tween ...
Read more >
Scrollmagic NPM | npm.io
ScrollMagic is also available on bower and will only install the necessary source ... To use plugins like the indicators visualization, simply include...
Read more >
ScrollMagic setup for Webpack (a CommonJS setup)
addIndicators ({ name: "2 (duration: 300)" }) // add indicators (requires plugin) .addTo(controller);. NOTE: If you want to use minified ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found