Use js and css to write a floating box that can be automatically hidden. Css must be used to control the style. js is used to control the display and hiding of the style. If you need it, you can refer to a small example today, use js and css to write a floating box that can be automatically hidden. Css must be used to control styles. js is used to control display and hide styles. There are two methods to display and hide: 1. Use js to control its display attributes; 2. Use js to control its size.
What we want to talk about today is to control the size of the element to realize the explicit hiding of the element. The principle is to register the mouse moving and removing events for it. When the mouse moves out of the object range, set its width to 1, when the mouse moves the object again, the width of the object is restored. It's easy. Let's take a look!
Hidden status:
The narrow line on the left is the hidden floating frame.
Display status:
When the mouse slides to the left floating frame, the floating frame is displayed again.
CSS style:
The Code is as follows:
JS Code:
The Code is as follows: