Navigation verticale contextuelle latérale créée à l'aide des effets d'animation jquery et css_jquery

>html, body, ul , li {
marge : 0;
padding : 0;
bordure : 0;
contour : 0; -famille : "Verdana" ,"lucida sans",Sans-serif;
font-size:
}
html, body {
min-height: 100%
color; : #FFFFFF;
background-repeat : répéter-x ;
background-position : top
background-color :
}
ul.side_nav {
width : 200px;
float : gauche;
marge : 0;
padding : 0;
ul.side_nav li {
position : relative
float : gauche ; 🎜>marge : 0 ;
padding : 0 ;
affichage : en ligne ;
}
ul.side_nav li a {
largeur : 165px
border-top : 1px solid #; 3373a9 ;
bordure -bas : 1px solide #003867 ;
remplissage : 10px 10px 25px
affichage : bloc
couleur : #fff ; >arrière-plan : #005094 url ​​(sidenav_arrow.gif) sans répétition 5px 10px ;
position : relative
z-index : 2
}
ul.side_nav li a:hover {
background-color : # 2d353f ;
}
ul.side_nav li div {
affichage : aucun
position : absolue
haut : 2px 
gauche : 0 ; 🎜>largeur : 225 px ;
arrière-plan : url(bubble_top.gif) no-repeat right top;
ul.side_nav li div p {
marge : 7px 0 ; hauteur : 1,3em ;
remplissage : 0 5px 10px 30px ;
couleur : #444 ;
arrière-plan : url(bubble_btm.gif) pas de répétition en bas à droite
}

< ;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js
">
< ;script langage="javascript">
$(document).ready(function() {

$("ul.side_nav li").hover(function() {
$( this).find("div").stop()
.animate({ gauche : "210", opacité : 1 }, "rapide")
.css("affichage" , "block")
}, function() {
$(this).find("div").stop()
.animate({ gauche : "0", opacité : 0 }, "rapide")
});

>

Corange.cn

ASP

Apprenez à me connaître.