Tag: #50projectsIn50days
All the articles with the tag "#50projectsIn50days".
-
50projectsIn50days – Day 7: Split Landing
A simple html with a button and two images. Which changes the behavior if the class adds a left or right depends on the mouse. In fact, the CSS code is the following: .hover-left .left { width:
-
50projectsIn50days – Day 6: Scroll Animation
The Scroll Animation is a scroll that has a fixed number of contents inside the html. So, it's not generated dynamically. In the case of this project there are 12 Boxes. Each h2 box has a class "Box"
-
50projectsIn50days – Day 4: Hidden Search
A search bar that has an interesting animation inside it. The changes happen when the "active" selector is used. There are two, one for the input, and other for the button: .search.active .input {
-
50projectsIn50days – Day 5: Blurry Loading
A really simple HTML and CSS which involves some tricky JavaScript archive the blur effect. Because, besides the blur effect, the project consists in showing an increasing percentage of how much the
-
50projectsIn50days – Day 3: Rotating Navigation
A simple article written in plain HTML with has the flip change. If you click on the hamburger menu, the article will rotate 45 degrees. It's a nice transformation that is created thanks to adding to
-
50projectsIn50days – Day 2: Progress Steps
The projects related to the progress step it is generated by an another script in JavaScript that change the class in the DOM. There are two event listeners in the script and there is a function that
-
50projectsIn50days - Day 1: Expanding Cards
The first day of the project is about expanding cards. It's a nice introductory projects if you don't know anything about JavaScript. It's easily reusable and I enjoyed while I was doing it. The