[Pro] css menu hover border

Freeway
1

trying to get a animation effect on css menu. Would like a sutle
hover effect when hovering over menu item to show border fade in. Have tried transform but seems to affect text so have ended up with http://www.mattbrooke.co.uk/outline/index.html
but this affects text. would like to have border with above effect but text not to change like! http://www.mattbrooke.co.uk/outline/noanimation.html

any ideas appreciated

Matt.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

2

hover effect when hovering over menu item to show border fade in. Have
tried transform but seems to affect text so have ended up with
http://www.mattbrooke.co.uk/outline/index.html

Hi Matt,

I think you’ll have better luck this way. First, add your border like this:

#fwNav1 .fwNavItem a { border: 2px solid transparent; }

Leave the other attributes unchanged.

Next, add your hover state like this:

#fwNav1 .fwNavItem a:hover { -webkit-transition: border .5s ease;
border-color: rgba(255,255,255,0.6); }

Deleting the previous #navigation5 a:hover style.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

3

http://cssway.thebigerns.com/workbench/matt-menu-transition/

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

4

that’s great Ernie just what I was after.

Many thanks Matt.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options