Jump to content
Search Community

Draggable bounds in Edge Animate.

visua test
Moderator Tag

Go to solution Solved by Diaco,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I have a wide element in my project that I've applied the Draggable behavior to. My aim is to make it so that you can only drag the element to its absolute left, and right. This works rather well so far, however I've been unable to make the bounds adjust properly when the browser is resized. This noticeable if you have a small viewport, then scale it larger and drag the element to the left, its right boundary is still at the old viewport size. http://www.michaelnovia.net/challenge/006/

 

Here's my code

Symbol.bindSymbolAction(compId, symbolName, "creationComplete", function(sym, e) {

   dragScene = Draggable.create(sym.$("scene"), {
   	type: 'x',
   	throwProps:true,
   	bounds: {left: 0, width: $(window).width()}
   });

});

Symbol.bindElementAction(compId, symbolName, "window", "resize", function(sym, e) {
   // insert code for resize event here
   dragScene[0].applyBounds();
});

Thanks,

Michael

Link to comment
Share on other sites

  • Solution

Hi visua  :)

 

Carl is right , but since you set Stage width: 100%; , you can simply pass the Stage as bounds and you don't need to update the bounds on resize :

 

Draggable.create(sym.$("scene"), {
   type: 'x',
   throwProps:true,
   bounds: "#Stage"
  });
  • Like 2
Link to comment
Share on other sites

Thank you both for responding. That was quick and easy!

 

Carl – your solution worked, though I had to wrap the params in braces

dragScene[0].applyBounds({left: 0, width: $(window).width()});

Diaco.AW – This worked flawlessly, thank you. I was over thinking it apparently  :mrgreen:

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...