Płynne przechodzenie podkreślenia w menu Opcje

[Kleryk]

Witam,

Chciałem zrobić płynnego hover na moje menu, ale za chiny nie wiem jak to w Googlu nazwać wpisywałem już kilkanaście fraz ale nie znalazłem nic co by było związane z tym co chce zrobić.

O co chodzi; active i hover to są zwykłe podkreślenia tekstu; np: zakładka start jest active i pod jej nazwą jest podkreślenie, a gdy zacznę jeździć po menu to ta linia albo jakaś nowa linia będzie płynne przechodzić pod nazwami menu, nie tak jak normalnie jest, że znika z pod tego tekstu i się pojawia obok, tylko płynnie przesuwa się z jednej zakładki do tej, na której mam aktualnie myszkę.

Chociaż link bym poprosił jak ktoś się już spotkał z takim rozwiązaniem.

Pozdrawiam

[Kleryk]

Zapomniałem dopisać, obrazek też nie, na stronę przeniosłem tylko kod z css i zaincludowałem biblioteki js head oraz dodałem menu jako ul li itp

P.S
CSS

Kod

     .lavaLampBottomStyle {
            position: relative;
            height: 29px;
            width: 421px;
            background-color: white;
            padding: 15px;
            margin: 10px 0;
            overflow: hidden;
            border: 1px solid gray;
        }
                .lavaLampBottomStyle li {
                    float: left;
                    list-style: none;
                }
                    .lavaLampBottomStyle li.back {
                        border-bottom: 5px solid blue;
                        width: 9px;
                        height: 30px;
                        z-index: 8;
                        position: absolute;
                    }
                    .lavaLampBottomStyle li a {
                        font: bold 14px arial;
                        text-decoration: none;
                        color: #000;
                        outline: none;
                        text-align: center;
                        top: 7px;
                        text-transform: uppercase;
                        letter-spacing: 0;
                        z-index: 10;
                        display: block;
                        float: left;
                        height: 30px;
                        position: relative;
                        overflow: hidden;
                        margin: auto 10px;
                    }  
                        .lavaLampBottomStyle li a:hover, .lavaLampBottomStyle li a:active, .lavaLampBottomStyle li a:visited {
                            border: none;
                        }

Znalazłem (IMG:style_emoticons/default/smile.gif) W css był a cssa badałem firebugimem i nic mi nie pokazywał, dzięki za pomoc :*

BTW to to menu nie działa (IMG:style_emoticons/default/snitch.gif) nie przechodzi do linków które się poda, nic się nie dzieje jak klikam, pokazduje mi adres, a jak kliknę otwórz w nowej karcie to mi otworzy.

Ten post edytował Kleryk 10.04.2012, 13:19:09