Ефект за меню

[mitaka961]

Здравейте, имам един дизайн с едно меню в което съм планирал един доста добър ефект. Проблемът е че незнам как да го постигна. Ето менюто:

Както виждате под начало има едно бяло сиание. Искам когато се посочи с курсора да се мести с jQuery ето по този начин : http://apycom.com/menus/1-black.html

 

[inferno16]

Мисля че ако преработиш този скрипт ще получиш желаният ефект.

 

[dakata__92]

Със CSS ще стане и втора снимка която при ховър да се показва :

[css]
#menu {
margin: 0 auto;
height: 40px;
background: #2775b6 url(../img/menu.png) repeat-x top left;
}
#menu ul {
list-style-type: none;
}
#menu ul li {
float: left;
}
#menu ul li:hover {
background: url(../img/menu_hover.png) no-repeat top center;
}
#menu ul li a {
color: #ffffff;
line-height: 40px;
background: url(../img/sep01.png) no-repeat top right;
display: block;
padding: 0 10px 0 10px;
height: 40px;
float: left;
font-weight: bold;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
text-decoration: none;
}

[/css]

 

[stoqnski]

Със CSS ще стане и втора снимка която при ховър да се показва :

[css]
#menu {
margin: 0 auto;
height: 40px;
background: #2775b6 url(../img/menu.png) repeat-x top left;
}
#menu ul {
list-style-type: none;
}
#menu ul li {
float: left;
}
#menu ul li:hover {
background: url(../img/menu_hover.png) no-repeat top center;
}
#menu ul li a {
color: #ffffff;
line-height: 40px;
background: url(../img/sep01.png) no-repeat top right;
display: block;
padding: 0 10px 0 10px;
height: 40px;
float: left;
font-weight: bold;
font-family: Verdana, Geneva, sans-serif;
font-size: 12px;
text-decoration: none;
}

[/css]

подкрепям като ховър-а е това полу-прозрачното сиание , jQuery можеш да ползваш вече да подскача този ховър ли някви такива истории

 

[kikity_94]

той ховъра може да си го направи ама въпроса му беше как да направи да преминава плавно като менютата в apycom
Но пък може да вземеш и техния ефект ако успееш да го вмъкнеш в менюто си