Do all the things like ++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatarSign Up
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple APILearn More
Search - "css animation"
When you show your girlfriend the CSS animation that took you 2 days to make and she gives you the most unimpressed look.5
Designer - *showing an animation made with after effects* Lets add this really cool animation in our website
Me - Actually that will be very difficult with plain CSS. We will have to use some heavy animation libraries, and we don’t have that much time for the project.
Designer - Found a better animation
*shows another animation*
Me - *awkwardly* This is more difficult to implement than the previous one
Designer - What about this one
*shows yet another difficult animation*
Me - *ashamed and questioning my skills* ummm....
Designer - you know what, just add fade-in-out7
>> this === rant
At beginning of this year, I only knew HTML, JS, and CSS so I just applied for offers like "Jr Apprentice Dev in Front-End"
In a interview call, the woman told me that they will send me a test asking about my JS and HTML5 knowledge.
When I look in my inbox, the mail subject says "Back-end Test".
Then I call the woman:
Me: "Hello, I have received the test mail, but maybe it's wrong. I applied for a Front-End position and the test is about backend! "
She: "Do you have skills in JS and HTML5?"
Me: "Yes!, and CSS3"
She: "Well, the test is about that. JS, jQuery, and HTML5"
Me: "Sorry, that languages are Front-End. In the subject say 'Back-End' and Back-End is PHP, SQL, MySQL, Java, .Net... I don't know nothing about that. I only know HTML, JS, CSS."
She: "It's the same"
Me: "I sorry but it's not the same. Fron-End is client-side, what users sees. Animation, colors, FXs, buttons, forms... And Back-End is server-side, what users doesn't see."
She: "Well, JS, HTML, and CSS is backend for us. We call it that way too"
Me: "Sorry but that is wrong. I invite you to read some basic info. Now I am confused"
Of course that I am not confused. That idi0t was wrong.
Perhaps recruiters should take some info about areas where they are recruiting... (:T)3
What is worse than clients? Yeah, you know it now, the answer is coworkers.
But worst than coworkers, there is another category, which is the “exes” (coworkers).
Let’s talk about Jay (fictional name).
This guy is a spaghetti developer who managed to create a CMS in 1998, which is a fucking bug nest. You can’t do anything without having to write code here and there, and the user is not autonomous. Every fucking module has to be rewritten for every website, it’s slow, it freezes, it’s inconsistent structurally talking, not secured (ok we’re talking about 90’s ) and i don’t know how the fuck he managed to sell it to clients and to convince my boss to sell it and finance its development until 3-4 years ago.
I’ve been working on this masterpile of shit and also learnt to summon daemons to make this shit work, but still, writing PHP from scratch would be a pleasant task compared to work with it to be honest.
Anyway, last year my boss asked me to rewrite all the css of our website and I was fine with it, as long as I had The design files available. And this was ok, we work with a designer and she even bought me a Sketch license to open her files. (I have to mention nice people too sometimes).
This SCMS (Shitty CMS) works with less files to be compiled in css and should update automatically, then in the proper CMS windows you should be able to assign styles and shit. And I didn’t talk about the structure. There were at least 400 css classes for 5 pages...
However 2/3 times this shit couldn’t assign any horse fuck to anything, and stuff even broke. I try to adjust an animation, a slider in another page breaks. The developer was like “you don’t know shit” but still, the cockroaches fucker took 3 days per issue, and sometimes it stayed unsolved.
After weeks of thinking about this (we started “building” the new website in 2015...) he finally discontinued this piece of contemporary art and also started to make clients move to something up to date.
Peace was brought to me... until today.
A client calls and sees that an image slideshow doesn’t work properly on mobile.
Talked about this to my boss, and now he doesn’t want to make them switch and I will have to try to port this to something more modern. Time allocated : 4 hours.
I tried to explain him the fucking hell it is, but still, he wants me to fucking develop a slideshow on this human atrocity.
I’m going to cry and summon a demon to exchange my soul wig I don’t know whatever fucking skill I will need to achieve this.19
I've seen people doing story/rant to introduce themselves, and I never done that, probably because I'm terrible at doing so, and the more people their is, the more complicated it gets for me. 😥
Usually I try to blend in, and be the same color as the wall. But I want to try something different, so bear with me as I go through this painful process. 😶
So here I am, a lonely dev, who only have friends through a screen, living in a dark room only lit by green leds (tho sometimes it turn red/pink), lost in a small street of Paris. I usually avoid posting on social media, but here on devRant, I feel alright, somehow, it feels like home... 🤗
Started developing at 14 with html and php, then css and js (with the later still being a mystery to me). 🤔
I never really had a real job. Had 3 month as an intern into a human size web agency, and despite the recommandation they gave, I didn't like the job... Dropped from school and self learned everything I know today. Did a certain amount of personal projects, but no publication for lack of confidence. As of today, I'm 28. 🙂
Then a year and half ago, I changed to c# with unity3D, and I had a ton of fun since. 😄
Learned cg effect, texturing, 3d, a bit of animation. I'm working on a project of indi game with two people that are my only social interaction outside of my family, and now devRant. I don't mind being lonely tho. 😯
But this community is awesome, so I'm glad I stumbled across that sad face on the play store. 😄
Also it's 7:30am, I didn't sleep because of this post, I'm tired, and yes I'm an idiot.21
CSS Grid Clock (Animated)
A Clock with the power CSS Grid and animations the result is a beautiful and futurist approach. The demo shows two variants one with the full power of the animation and the other with real clock logic.
Check it out guys and tell me what do you think.
I know last year suddenly lots of animated login popped out.
NPM actually uses one... and it doesn’t look that good15
For other just beginning web devs: spending hours fiddling over a bunch of CSS layout/formatting/animation to make a small widget look just right... Then showing someone your 500ms animation and they say "yeah and....???"1
Bottom navbar with great animation made with pure CSS. https://codepen.io/flavio_amaral/...
What do you thing?3
I can tell that I am getting tired when I start copying css / html from the devRant website to use in the devCredits site...
Anyways... the background is now animated and if animation is turned off, the background color can be modified through the link.
Also, @BindView cleaned up some stuff for me.10
"Not wk135, but blah blah blah"
Please don't misuse wk135 (Sorry)
It's about coding tests
Thank you. */
A company took their technical test on this really weird website. There was a Windows Narrator guy's voice giving instructions while a timer was running. I had to flash my ID to the webcam and then fit my head on an outline on the screen. It was for a web dev position. I had to speak into the microphone to answer the Narrator's questions and then send the video to them. The questions were weird and hypothetical, mostly. I just thought that their process was dumb and unnecessary.
I don't like aptitude and algebraic tests. One company, I remember, had their test on Google Forms. For some multiple choice questions, they put check boxes instead of radio buttons. So, I could just blaze through it selecting all options. Some of the questions had their first option as "All of the above" 🤔. Fortunately, I didn't pass the test.
My most intense day was in the company at the day we had to publish a website containing lots of jQuery & CSS animated stuff.
We planned to go live at 3pm but due to the fact that before lunch time there began to appear more and more styling and animation problems, we went live at around 9pm. I was sweating and nervous as hell the whole time.
At least my boss and I went to drink a few beers right after that. ;)
So apparently Firefox can't handle (quick) animations from opacity 0 to opacity greater-than-zero and glitches around. Instead you need to animate starting from something greater than 0, like 0.001.
I had to debug this shit and it just adds to my reasons to dislike this browser.5
Let it snow! let it snow! Let it snow! A christmas tree made only with css. Codepen: https://codepen.io/flavio_amaral/...5
Does anybudy still use Adobe Animate/Flash for web animations?
They teach it at my school and at the moment I see no reason to use it. I'm probaly faster writing it by hand in CSS / JS, and it will run smoother that the animate files...6
the more i learn about web dev, the more i realise the reason for its mess up . There are 2 major problems in it : the people who create various important concepts and tools for web dev were 1) working on it without any collaboration and agreements on the philosophy and 2) were too stubborn on their ideology i guess.
There is no limitation to anything's functionalities, and the limits that are "defined" are badshit crazy. for eg:
HTML creator : "I am gonna make a language that would provide a skeleton to web page. it will just have the text and basic markers to let the scripting and styling engines/languages know which text is supposed to be rendered and how.
It won't provide any click or loading functionality.
someone: "So i guess opening a page or loading an image would be handled by JS or other programming language? also, bold , italic or division would be added via CSS?"
HTMLguy : Nah, my html engine would ALSO do that.
someone : what , why? won't that just be stupid and against your philosophy?
HTMLguy : WHAT? am too awesome, can't hear you
w3c , 50 yrs later : sorry can't change this, gotta support the 50 yrs of web dev and billion sites
CSS guy: I am gonna make the world's best beautifying stylesheet language to provide colors, styling, fonts and backgrounds to a page. every loadings and clicks would be handled somewhere else
Some1: cool, then clicks, hover and running of animation would be handled by JS only
CSSguy :Umm, i guess i could handle those.
CSSguy : Thankyou Thankyou Thankyou for the nobel price!
JS guy : I am gonna make a god web programming language! It can do everything: add/remove html tags, add styling, control animations, control browser, handle clicks , perform operations, everything!
some1: cool! you must be making very large programming language with lots of modules.
JS guy: No! i am gonna keep it small. no built in classes and file imports! just use the functions directly. if someone wants the additional lib functionality, install them on your server
some1 : innovative! what's typeof NaN ?
JSguy :shut up.7
I was designing and building a portfolio page for a photographer. He mostly does black & white portraits with either a white or black background so I had the idea of splitting the page into a light and dark side (Star Wars joke definitely intentional).
I worked waaay too long on a *diagonal* CSS wipe animation when the user switches sides and I was quite proud of it.
Half a year later we realize that basically no one has noticed the switch button. Analytics confirmed it was less than 4% of visitors. 🤦♂️3
So our company wants us to start learning/sharpening our Python skills for work. We signed up for CodeWars and ran through our first Kata today. I'm excited to learn, but I don't have any actual experience with anything but HTML/CSS and super basic JS for just things like animation... I feel like such a fucking moron trying to work through this Kata. Because our manager wanted us to only spend like 15-20 minutes on it. I spent over 4 hours trying to figure out the right place to even start, even with reading documentation and trying to find similar examples online and after 4 headsmashingly long hours I couldn't even get an idea of how to tackle the problem.
Watching python videos to try and figure this out...15
Gna gna gna Chrome you stupid sucker!
I have some objects that I animate using JS triggered CSS translate with a transition duration. Why on earth would Chrome think it's a good idea to apply that duration also after the animation when I zoom the whole page?!
OK, slap a transition end handler on the object and reset the transition duration when the animation is done. But FF doesn't have that problem in the first place, and even IE works as intended!5
A coarse implementation on Google’s Thanos effect (mobile version) on codepen with raw css and js.
😈 what do you guys think?
The desktop one seem use a html2canvas package, which isn’t something I really interested.5
you call your self master of CSS and the only thing you are good at is using frameworks always for animation and every little task. you can't even do simple animation with css. FUCKING BASTARD2
Chrome has failed me. At least, I was disappointed.
So, I have been working with an animation studio to make some changes to their Website, typical WordPress website.
Nothing wrong there, I have a copy of their WP site running on a localhost so I can make changes & tests before pushing to bitbucket (then to be deployed). Now, a lot of the changes I have been making are minor css, html & js changes. Mostly FrontEnd changes.
The frustration came when working on a couple JS sheets; I would change some CSS and JS, save the files then go over to Chrome to test them out.
Open the localhost and test the changes, CSS changes worked! Looks good, but for what ever reason the JS functionality would not change. 2 ish hours of frustration, seeing only half of these changes working I decide to step out for a coffee break. Then I remembered; Chrome has a nasty habit of caching files it has used before for later use. Turns out it was using some older versions of the files that it had cached.
Thankfully I remembered this; only ended up being 2 hours of frustration. For anyone else using Chrome for development; keep this in mind.1
I applied for a job as Frontend Dev, went to an interview and was rejected... Well they offered me to come to another interview for another position and if I'm lucky I will do animated and interactive Banners with CSS animation and JS in the future! So freaking awesome!2
For the brave souls among you... Email On Acid have made an excellent PDF guide on CSS animation in email.
No, that's not a typo! 😮💥
Going into a web animation class hoping to finally learn CSS animations as well as how SVGs work (I never knew)
Ending up finding out that the prof is using frameworks like Animate.CSS. FUCK.
I didn't pay thousands of dollars to learn the frameworks I have been using for the past four years!!!3
If kinda curious about the Blazor Framework of Microsoft about the c# replacement. I'm a designer heavily concern about animation on the web, for what i have know till this day. Animation on the web was made by CSS and JS, and if c# replace js. That means all the toys libraries will be gone and we have to reinvents the wheel all over again.5
Create an animation of tree traversals.
I could use any framework or library, but I just used plain html/css/js.
It was fun.2
Chrome handles CSS animation on an SVG element with 500 nodes like a champ with an SVG graphic with outline animation over it.
Firefox barely animates the SVG then has tearing issues when a part of the SVG leaves the viewport and re-enters. Annoying AF and now a changed design.
used bootstrap, and the found a prety elastic side menu animation, turned out it can'twork with the best css fw.. fml