This may be actually simple, but I need someone that can quickly give me a quick answer to this.
I want a situation where my website will transition smoothly at a break point when one re-sizes his browser.
I don't want the breaking points to be jumping. I want it to break to another point smoothly.
Can anyone tell me how to achieve this with css3 effect?
Thanks
You can't do this with CSS transitioning unless you use a lot of positioning and percentages.
Remember it's only us developers that go around re-sizing browsers all the...the vast majority of viewers will only need to see it at the device width.
I made a menu once with different paddings on the buttons in MQs. Used transition for all properties for something else (background color on hover + lazyness). Added bonus effect was smooth resizing of the menu when resizing the window :)
That said I agree with Paulie, seriously... no one* is resizing the window all the time just to see smooth animations, no one* cares.
except probably developers. Me: Look how smooth this menu resizes resizes window a few times. Brother: Cool...
Interesting, I didn't think you could transition colors...learn something new every day.
Perhaps I was thinking of animate with keyframes...and I could be wrong there.
What I mean was if it's layout e.g. floats you can't transition those.
I recall that CSS-Tricks (v9) used to do something like I think he's talking about but I'm pretty sure that was done with positioning &/or margins &/or percentages.
I think the last version of CSS-Tricks did transition but it really makes no difference, like everyone has already said, no on goes around resizing browser windows apart from developers.
@Paulie_D, yes, def can't transition floats, but like you, and the rest of the css-tricks community, I agree that transitioning anything with media queries is utterly pointless. Nobody besides designers/developers sit there and resize their browsers to see transitions..I have a few similar stories to @CrocoDillon, where I do something I think is super cool with a media query transition, show a few people, and get a generic "cool" for a response.
This may be actually simple, but I need someone that can quickly give me a quick answer to this.
I want a situation where my website will transition smoothly at a break point when one re-sizes his browser. I don't want the breaking points to be jumping. I want it to break to another point smoothly.
Can anyone tell me how to achieve this with css3 effect? Thanks
You can't do this with CSS transitioning unless you use a lot of positioning and percentages.
Remember it's only us developers that go around re-sizing browsers all the...the vast majority of viewers will only need to see it at the device width.
CSS Transitions
@ChrisP
You can't transition / animate 'on/off' states like float, colors, background images etc with CSS.
@Paulie_D, he didn't specify that's the kind of transitions he wanted..you can transition background-colors, widths, heights, font-sizes, etc..
http://codepen.io/ChrisPlz/pen/GntpF
I made a menu once with different paddings on the buttons in MQs. Used transition for all properties for something else (background color on hover + lazyness). Added bonus effect was smooth resizing of the menu when resizing the window :)
That said I agree with Paulie, seriously... no one* is resizing the window all the time just to see smooth animations, no one* cares.
@ChrisP
Interesting, I didn't think you could transition colors...learn something new every day.
Perhaps I was thinking of animate with keyframes...and I could be wrong there.
What I mean was if it's layout e.g. floats you can't transition those.
I recall that CSS-Tricks (v9) used to do something like I think he's talking about but I'm pretty sure that was done with positioning &/or margins &/or percentages.
@ChrisCoyier would know.
I think the last version of CSS-Tricks did transition but it really makes no difference, like everyone has already said, no on goes around resizing browser windows apart from developers.
@Paulie_D, yes, def can't transition floats, but like you, and the rest of the css-tricks community, I agree that transitioning anything with media queries is utterly pointless. Nobody besides designers/developers sit there and resize their browsers to see transitions..I have a few similar stories to @CrocoDillon, where I do something I think is super cool with a media query transition, show a few people, and get a generic "cool" for a response.
Ok. Thanks.