Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Maximilian Stöhr
7,479 PointsjQuery, missing animation
Hi guys, http://codepen.io/Maxi9700/full/RWqKNQ/ I have a problem with the animations jQuery provides.
On my site, you should see six black lines(actually they shall be boxed, but it doesn't matter atm). I've centered them using flexboxes, and I want them to resize as I click them (which works).
First, by clicking on a line, it started to resize itself from the center of the page, but I wanted them to start from where they were originally. What I did was to give the upper left a float: left when I click it. Now it starts resizing from the left.
My problem now is that by clicking the upper middle line, I get an animation, but if I click on the upper left, it just resizes in 0.0s. I want to have the same animation-speed for the left one. Any suggestions?
Thanks for reading through all this, Max
PS: U can close the Lines by clicking the header, only the upper left and middle line work at the moment.
Maximilian Stöhr
7,479 PointsOk, the link above works for me. Does http://cdpn.io/RWqKNQ work?
rydavim
18,814 PointsNope. My guess is that is has something to do with sharing or permissions. I'm not particularly familiar with codepen, but it may be that your code is set to private or something similar? Does the link work for you if you're logged out?
Maximilian Stöhr
7,479 Pointshttps://w.trhou.se/6nf57a2spa Screw codepen, here we go!
1 Answer
rydavim
18,814 PointsSorry about the codepen issues. The workspace link works fine for me, but I'm not sure I understand the problem.
When I resize any of the blocks, they all resize at the same speed. The way I read your question, isn't that the intended behavior?
Maximilian Stöhr
7,479 PointsDamn I meant something else, my problem is the speed when they pop up, so gain size. I'm sorry, I wrote something else above :(
The upper left gets big instantly, while the upper mid takes some time. I want the left one to make the same animation.
rydavim
18,814 PointsI think I still don't understand. Nothing is happening instantly for me.
Maximilian Stöhr
7,479 PointsOk, this is some crazy sh*t. In your gif, it works just as I want it to work. I tested it on Mac, Safari/Chrome, both over local storage and treehouse workspace, and it doesn't work like your version does.
Can u tell me which browser you use?
And thanks for helping me so much! :)
rydavim
18,814 PointsWell that explains why we weren't on the same page at least. XD
That gif was recorded using the workspace preview in Firefox 42.0 on an OS X 10.11 machine.
It sounds like maybe the animations aren't working properly in certain browsers only. I believe Safari and Chrome are both webkit based browsers, so it's likely a problem with that particular browser engine. I believe Firefox uses the Gecko engine.
You can try looking for solutions, but I didn't have much luck googling your specific issue. You might look into just doing the re-sizing a little bit differently. Let me know if you get stuck, and I'll try to come up with an alternative solution.
Maximilian Stöhr
7,479 PointsI just got Firefox: Seems like it only works in there. What alternative solution would you do? I tried this for too many hours now.. And thank you again!
rydavim
18,814 PointsI couldn't find a good way to do the animation you want without using CSS, which is what seems to not work in webkit based browsers.
It's not really the same type of animation, but you could try using jQuery's effects for better browser support.
Maximilian Stöhr
7,479 PointsYou Sir, are the most amazing person I've met on treehouse so far. Thanks so fucking super hyper much for your help - it sucks I can't get you more then one up-vote. Again, fucking THANKS! Let me now if I can ever return the favor!!!
rydavim
18,814 Pointsrydavim
18,814 PointsSorry, the
http://codepen.io/Maxi9700/full/RWqKNQ codepen link doesn't seem to be working. Note that you don't want the carriage return at the end , but even with that removed it gives a 404 for me.