Contact us:
  • Phone number: +1 (516) 321-1856
  • E-mail: info@abcname.com
  • Skype Office: ABCname.Company
  • Skype Manager: Krutevich_Andrey
Send your feedback:
 
+1 (516)321-1856Don`t call us at night, guys!
 
Brisk CSS3 menu
Now we are going to show you the way to vary your menu by adding an accurate effect when mouse-pointing on it. The main idea is about smooth image display while mouse-pointing a menu paragraph.

Every menu item will have an anchor, containing two spans and images:
 Then we have to stylize our list. We`ll give .mh-menu the background color RGBA (255 255 255, 0,8), meanwhile mouse-pointing will change the font-color to RGBA (225 239 240, 0.4):
 The second step is to give all the list elements another color when mouse-pointing:

The image will start apearing on the right side, first being located at the left side. We’ll also add a smooth transparency transformation from 0 (starting point) to 1:
 That`s all, and now we have a nice sliding effect! Make sure that anchor`s z-index is located above the image, not above it. In addition, we can make the anchor`s background non-transparentwhile mouse-pointing: fully white (demo 2), or give every menu item a different color (demo 3).