Share Posted May 15, 2015 Hi, I have an element that is set in the CSS to 100% to start and then animates to a smaller width. I need this width to be different if the screen is smaller so I'm using a $(window).width in JavaScript to pass the desired destination width to TimelineMax. This works but I need this width to respond to changes in window width. Using $(window).resize() to try and change these widths again in the JavaScript seems overkill. Can anyone offer a more elegant solution? I can't use .from because that element must be 100% when the page loads, and I can't circumvent the delay before the JS kicks in (as far as I know). Change the browser width before you run the Codepen to see the difference. Thanks! See the Pen ZGWVwe by anon (@anon) on CodePen Link to comment Share on other sites More sharing options...
Share Posted May 15, 2015 Hi mikeebee you can handle that with javascript media queries , and i think that's better to tween width with percent value maybe this can help you : http://krasimirtsonev.com/blog/article/Using-media-queries-in-JavaScript-AbsurdJS-edition or http://tylergaw.com/articles/reacting-to-media-queries-in-javascript 1 Link to comment Share on other sites More sharing options...
Share Posted May 15, 2015 Good links. This thread and demo might also be helpful. See the Pen vExQEy by osublake (@osublake) on CodePen 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now