Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Havas Media

Members
  • Content Count

    11
  • Joined

  • Last visited

Community Reputation

2 Newbie

About Havas Media

  • Rank
    Member
  1. Whoaw! Thank you so much for this reply Blake. I had a quick look at the codepen and the topics, i have to read that again and again and make some test (_gsTransform seems interesting). My JS skills are limited compared to yours.... So i'll have to work on that (it seems JS can bring some workaround) I won't hesitate to ask you if i have issues that i can't solve by crawling gsap forums. Thanks again, Bernard
  2. thank you for those explanations, it's hard to deal with css sometimes
  3. My main goal is to manage responsive animations in landscape and portrait mode. I use tweens with +=className and define different positions (and width, height, etc...) for my item in css media queries. Flexbox works fine for re-positioning! Here is a really basic example of what i succeed to do with flex container and child margin settings : https://codepen.io/bquarante/pen/xdWEQP Resize page and reload to see the .item position changing from "center center" to "right bottom" (landscape) or "left top" (portrait) The tween works on Chrome ( i can see the margin style tweening in the DOM) but not on FF... any clue ?
  4. Hello Blake, Obviously it's the best option. I didn't want to use Flexbox initially because i need a very good browser compatibility (banner ad can be display on so many devices)... but i have to admit that this responsive case (interstitial ad) is strictly for mobile/tablet use so it should be ok. http://caniuse.com/#search=flexbox The Animated Flexbox Playground codepen is one of my favourites <3, so easy to understand Flexbox properties with it... Now I need to make some "real" banner tests with Flexbox (i think it will do the job perfectly) Thank you all for your answers!!! I'm always surprised and delighted to see how quickly the answers arrive. All the best, Bernard
  5. I already tried that before... but it works only once, i can't overwrite css several times with !important (and as you wrote, it's not a good practice - as Harry Roberts and many others would say )
  6. Thank you Jonathan, it's more clear now... Finally it seems i can't use "tween responsive positioning" the way i wanted to if i remove the class in JS and replace it in the css, my element is not centered anymore when his parent div scales (width here) if i let the class in JS, the block stays centered when the parent div scales but a className can't override those inline css if i want to change position again. No choice but overriding all properties one by one in the tween...and still no solution to make it responsive with mediaqueries classes except making two different timelines with different tweens, huh.
  7. that class is defined in the JS : TweenMax.set(".right_bottom", {xPercent:0, yPercent:0, right:0, bottom:0}) (the reason i do that is explained here http://codepen.io/bquarante/pen/ryzYNg)
  8. I don't need specifically to tween a class here... I make banners and i often need to center elements into wrappers then uncenter them, so i use those "helper classes" i use className mostly to to deal with responsive banners and adapt tweens values on portrait and landscape i set different properties for one class in the css media queries part, i find it very usefull but it has some limitations with "helper classes"... When it starts to be too difficult (portrait design is very different than lanscape design, easing should be different....), i have to manage 2 DOM, 2 timeline and use JS. I'm just diggin' to find a easy way to build complicated design, i'm a bit lazy so i don't want to write too many code Anyway thanks for your help and fast answers!
  9. Hello Craig, thanks again for your last answer, i used that technic a lot now... Now i have a new question about this "tween and positioning" subject, maybe i should open a new topic.... I'd like to change the block position and overwrite properties ...with a className tween (or any other predefined properties 'object') the issue is that a className as no effect because of the previous inline css If you (or anyone who have time) could check that, here is the codepen : http://codepen.io/bquarante/pen/bWojWy Cheers, Bernard
  10. Works fine! I already used the xPercent an Ypercent and i found it very usefull (i saw the carousel example when it first came out) I tried to init my centering classes into css file... but i had to do it in the js file instead thanks a bunch!
  11. Hello, First, thank you for the amazing job!!!! Then, if someone would be kind enough to look at this pen : http://codepen.io/bquarante/pen/ryzYNg My problem is that i want to keep my .block centered but the scale tween override my block's css (transform translate) it works if i use immediateRender : false, it worls fine but i want my block to be hidden at start. Any help would be great, thanks a lot. Bernard
×