The effect of creating menu navigation based on CSS3 attribute transition

This article mainly introduces the CSS3-based properties transition make the menu navigation effect, can realize the mouse sliding menu item Dynamic change the background slider function, based on the CSS3 property transition implementation, very practical value, the need for friends can refer to the next

This article describes the CSS3-based properties transition making menu navigation effects. Share to everyone for your reference. Specific as follows:

CSS3 navigation menu, when you move the layer below the display layer, transition will cause the page to flicker, because chrome in the initial rendering of CSS animation when the bug, although temporarily unable to verify the root cause of the problem, but the current known solution has two:

-webkit-backface-visibility:hidden (Sets the back of the element that is being converted is visible when facing the user: hidden)

-webkit-transform-style:preserve-3d; (set how the inline element renders in 3D space: retains 3D).

The results are as follows:

The specific code is as follows:

<! DOCTYPE html>
 The above is the whole content of this article, I hope that everyone's learning has helped, more relevant content please pay attention to topic.alibabacloud.com!