Jump to content
Search Community

Draggable- Bounds and last rotation info

ErinD test
Moderator Tag

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

Hello,
 
I am creating a barometer that has an interactive needle for the user to adjust. I used the draggable type rotation to set it to spin, however when I tried putting in the bounds, (bounds:{minRotation:0, maxRotation:90}), it is not recognizing the bounds at all. Also, when I have tried to get the info on where the needle's last rotation degree lands (onDragEnd:function() { console.log(this.rotation);}), the console logs it as undefined. Any clues why this is not being applied?
 
Thanks,
 
ErinD
 
 

function init()
{
	console.log("yeash!!!!");
	needleImg= document.getElementById("bNeedle");
	barometerImg=document.getElementById("barometer");
	smallForm=document.getElementById("groupThis");
	//console.log(needleImg);

	TweenMax.to(needleImg, 3, {css:{rotation:145, transformOrigin:"193px 47px"},ease:Elastic.easeOut});

	Draggable.create(needleImg, 
	{
        type:"rotation",
        throwProps:true,
        onDragEnd:function() { console.log(this.rotation);},
        bounds:{minRotation:0, maxRotation:90}
    }); 
}

Edited by ErinD
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...