mimeartist

Slightly confused in that when I drag an item using draggable it works fine, but then when I try and move the image to a particular place by tweening it to say position 0,0 it is then offset by the amount (I think) I dragged the item from the original spot... I tihnk I'm using all the latest code... but is there a place to grab the other files other than just TweenMax... eg. is Draggable and ThrowProps and CSSPlugin available on a CDN? Thanks, James

Apologies if this is a little #lazyweb but been hunting everywhere to do a card flip type interaction, whereby you click a div and it flips around to show other content (text) on the reverse and then you can click back... I've been trying a number of jQuery plug-ins such as flip, and flippy... when someone suggested using gasp...which I'm already using... However I'm not sure how to implement the content on the back other than perhaps flipping the div through 90 degrees and then hiing and showing a new div... but not sure if this is the best approach? I've started with a flip that goes through 180 degrees, but am struggling straight of with it half disappearing behind the background image of the site, I'm guessing this is because I'm moving through z-levels from the rotation... anyway to solve this? I've tried upping the z-index of the div I'm rotating but this doesn't work... guess it's going through negative z-indexs Any examples you've seen would be great... If this is the wrong place to post this; I apologise! James

Thanks for the replies... I managed to make it work by using href's rather than javascript clicks.... probably not the best way to do something by just avoiding the issue! I struggle a bit with code pen, as to where to put the various links to .js files... is there a boilerplate of a standard green sock set up that people use as a starting point. James

I have a piece of text inside a panel and I'm using the draggable plugin and it works beautifully.... Within the text I have chapter points, and in another div on the panel i have links to those chapter points which when you click do a TweenMax of the scrollTop to the correct position. This is all working perfect on the desktop... but on iPad... the links just aren't clikcable... I've tried adding dragClickables:false to the draggable panel that it's sat but just not triggering the click... I thought it might jet not be doing the scrollTop tween... but i put a log in and it's not even seeing the click... So my question is how do i make links clickable in a div that is sat in a draggable div? Is there a command I'm missing... or should i put an invisible panel behind the clickable text and allow that to be draggable (which in turn affects the main panel and makes it move)?

Wow! So I thought.... hmmm how am I going to pick out what to animate etc... so thought I'd just paste in what I wanted to do... like this... TweenMax.to('#image1' ,2 , {'-webkit-mask-image': '-webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 100%, rgba(0,0,0,1) 105%, rgba(0,0,0,1) 100%)'}); ...and it worked! I can knock off early now (I wish) James

Thanks Jonathan, I'm really only looking to use it on touch interfaces, mainly iPad as I want my fades to relate to the user interacting with the images, ... so not too much off a concern in this case... Thanks for the heads up on the CSSPlugin... will look into it now

Does GSAP support this? I'm basically doing a wipe of one image over the top of another, but with a soft edge to it... I've got it to display correctly statically... i.e. I've worked out the values for the gradient of the top image over the top whereby it has the following -webkit-linear-gradient... -webkit-mask-image: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 55%, rgba(0,0,0,1) 100%) Whereby the 50 is the start of the gradient and the 55 is the end...i.e the blurry edge is 5% of the image... How do I target these using animate? so that 50 goes from -5 to 100 whilst 55 goes from 0 to 105 I thought about a loop and then just adjusting the css but can i access these as an animate instead?

Ah! Thanks for this... realised I had a different log in for the forum than my account... so when I was logging into the forum it was logging me out of my developer account... Will try and download again and try the Tweenmax, draggable and ThrowProps as mentioned, thanks both of you!