Moment For Technology

Incredible pure CSS scrolling progress bar effect

It's the yellow scroll bar at the top, which changes length as the page progresses. You can take a moment before reading on. Try to think about the above effect or start to try, without the help of JS, can clever to achieve the above effect. OK, go ahead. This effect is a similar small problem I encountered in the process of business development. In fact, even with javascript...

Learn front end animation from scratch - simple effects login

Recently, I suddenly became interested in Canvas animation, and then I read some articles on a whim. To be clear in advance, I am only a code porter for some original works. Let me just take a screenshot and tell you what I think. Again, I'm just a code porter, first of all, the scene of snow falling. Click here for reference article - Canvas to achieve snow falling, the article posted the code, it can be used directly...

Learn Less- just read this one

As front-end learners, we all have to learn CSS more or less. As one of the three cornerstones of front-end development, CSS is always leading the development trend of the Web. As a markup language, CSS may give beginners the first impression that it is easy to understand, illogical, not like programming should be. When the syntax is updated, every time a new property is proposed, browser compatibility becomes an immediate stumbling block, but...

Those interesting Codepen projects

Codepen is an online front-end code editing operation that supports many of today's front-end technologies, such as Babel, Coffeescript, typescript, SCSS, less, and Stylus. Can be used to display demo or code online. Codepen has a lot of projects going on right now, and there's a lot of great work out there.

Pure HTML + CSS implementation caterpillar

Caterpillar analysis A caterpillar is made up of circles from the inside out. The innermost circle is the closest to the center, and the outermost circle is the farthest. The rotation rate of the circle is the same, but the time (or position) to start the rotation is different. You start off and then you go from left to right

9 CSS tools for Web developers

No matter how experienced a developer you are, you want to keep your life as simple as possible. The right tools can help you do this. You're only as good as the tools you use, so it's wise to spend some time choosing the tools that are right for your needs. In this article, I'll discuss some of the tools that every Web developer can use to make your job easier and more productive. 1. The Transit...

Vue project skeleton screen injection practice

In the early years, when the front end code was tightly coupled and the back end engineers had to write the front end code, the front end was separated from the back end. This development method greatly improved the maintainability and efficiency of the front end projects, allowing the front end engineers to focus on their main business. However, this convenience comes with some disadvantages, such as first screen render time (FCP) because the first screen requires more content than before.

We've sorted out the four common ways to clear floats,

If we clear the float, the parent automatically detects the highest height of the subbox and then matches it. Disadvantages: IE6-7 does not support pseudo-element: after, use zoom:1 to trigger hasLayout. Disadvantages: hasLayout fires with Zoom :1.

How to optimize the picture in the [inventory] project

Every developer in the development project, it is inevitable to deal with the image, optimizing the image seems to have become a required course. Image optimization is not only about performance optimization, but also about experience optimization. As for how to optimize the picture, there is no fixed way, only a specific scene, specific analysis, choose the appropriate scheme. Not much to say, the following is also a brief introduction to their own processing, some of the ways to understand. If you have anything to add...

About (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.