Physics 2D example for click eventhandler on a dot

[LucitheR]

Hi there or Moin,

 

first of all i'm a newbie to GSAP, so i may miss the obvious and i'm in a bit of a peril

i copied the physics2d Demo, and thought to make it a simple Game, clicking a dot turns it red,but i can't seem to add eventhandlers to the dots. 

The docs for those tween lite didn't state any callback for the tweened objects, so i ask for your kind help.

 

how stupid am i?

 

here's my codepen

 

 

cheers, Jan

 

-edit: typo

See the Pen QNdgWK?editors=0010 by realLucitheR (@realLucitheR) on CodePen

[Jonathan]

Hello LucitheR and Welcome to the GreenSock Forum!

 

This is happening due to a JS error in the browser console:

ReferenceError: replayReveal is not defined

Your calling a function replayReveal() on line 33, but you don't have have a function with that name in your code.

 

[LucitheR]

Hello LucitheR and Welcome to the GreenSock Forum!

 

This is happening due to a JS error in the browser console:

ReferenceError: replayReveal is not defined

Your calling a function replayReveal() on line 33, but you don't have have a function with that name in your code.

 

thanks, i'm new to Codepen, too;  i have deleted it  but still no event

[Jonathan]

Its still happening because there is a inline style of pointer-events:none on the div with an id #featureBackground

 

The pointer-events: none CSS property will disable any mouse or touch events its applied to.

 

You could add this to your style-sheet to override that inline style on #featureBackground or just remove pointer-events: none from that div in your source code

#featureBackground {
   pointer-events:auto !important;
}

The !important declaration makes sure it overrides any inline styles on the tag.

 

See the Pen grgXJg?editors=0010 by jonathan (@jonathan) on CodePen

 

If your still having issues GreenSock's Jack and Carl will have to look into why pointer-events is being applied on your elements parent.

 

[LucitheR]

yay, that works! thank you all

 

 

Its still happening because there is a inline style of pointer-events:none on the div with an id #featureBackground

 

The pointer-events: none CSS property will disable any mouse or touch events its applied to.

 

You could add this to your style-sheet to override that inline style on #featureBackground or just remove pointer-events: none from that div in your source code

#featureBackground {
   pointer-events:auto !important;
}

The !important declaration makes sure it overrides any inline styles on the tag.

 

See the Pen grgXJg?editors=0010 by jonathan (@jonathan) on CodePen

 

If your still having issues GreenSock's Jack and Carl will have to look into why pointer-events is being applied on the dragged elements parent.