css de sağda kayan menu güzel bi olay

ademdinlaz
12-10-2010, 16:32   |  #1  
OP Taze Üye
Teşekkür Sayısı: 0
13 mesaj
Kayıt Tarihi:Kayıt: Eyl 2009

grmek için : demo

[ Tüm kodu seç ] [ Yeni Pencerede Göster ]
   body{         position:relative;         paddign:0px;         font-size:100%;     }          h2{         color:#FFFFFF;         font-size:90%;         font-family:arial;         margin:10px 10px 10px 10px;         font-weight:bold;     }          h2 span{         font-size:105%;         font-weight:normal;     }          ul{         margin:0px 0px 0px 0px;         padding:0px 0px 0px 0px;     }          li{         margin:0px 10px 3px 10px;         padding:2px;         list-style-type:none;         display:block;         background-color:#DA1074;         width:177px;     }          li a{         width:100%;     }          li a:link,     li a:visited{         color:#FFFFFF;         font-family:verdana;         font-size:70%;         text-decoration:none;         display:block;         margin:0px 0px 0px 0px;         padding:0px;         width:100%;     }          li a:hover{         color:#FFFFFF;         text-decoration:underline;     }          #sideBar{         position: absolute;         width: auto;         height: auto;         top: 200px;         right:-7px;         background-image:url(images/background.gif);         background-position:top left;         background-repeat:repeat-y;     }          #sideBarTab{         float:left;         height:137px;         width:28px;     }          #sideBarTab img{         border:0px solid #FFFFFF;     }          #sideBarContents{         overflow:hidden !important;     }          #sideBarContentsInner{         width:200px;     }HTML <div id="sideBar">          <a href="#" id="sideBarTab">         <img src="images/slide-button.gif" alt="sideBar" title="sideBar" />     </a> <div id="sideBarContents" style="width:0px;"> <div id="sideBarContentsInner"> <h2>side<span>bar</span></h2> <ul> <li><a href="#">Link One</a></li> <li><a href="#">Link Two</a></li> <li><a href="#">Link Three</a></li> <li><a href="#">Link Four</a></li> <li><a href="#">Link Five</a></li> </ul> </div> </div> </div>