ul.svertical{ width: 200px; /* width of menu */ overflow: auto; background:white;/* background of menu */ margin: 0; padding: 0; padding-top: 7px; /* top padding */ list-style-type: none; } ul.svertical li{ text-align: right; /* right align menu links */ } ul.svertical li a{ position: relative; display: inline-block; text-indent: 5px; overflow: hidden; background:#35BEFF; /* initial background color of links */ font: bold 16px Germand; text-decoration: none; padding: 5px; margin-bottom: 7px; /* spacing between links */ color: black; -moz-box-shadow: inset -7px 0 5px rgba(114,114,114, 0.8); /* inner right shadow added to each link */ -webkit-box-shadow: inset -7px 0 5px rgba(114,114,114, 0.8); box-shadow: inset -7px 0 5px rgba(114,114,114, 0.8); -moz-transition: all 0.2s ease-in-out; /* CSS3 transition of hover properties */ -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } ul.svertical li a:hover{ padding-right: 30px; /* add right padding to expand link horizontally to the left */ color: black; background: #0B55F1; -moz-box-shadow: inset -3px 0 2px rgba(114,114,114, 0.8); /* contract inner right shadow */ -webkit-box-shadow: inset -3px 0 5px rgba(114,114,114, 0.8); box-shadow: inset -3px 0 5px rgba(114,114,114, 0.8); } ul.svertical li a:before{ /* CSS generated content: slanted right edge */ content: ""; position: absolute; left: 0; top: 0; border-style: solid; border-width: 70px 0 0 20px; /* Play around with 1st and 4th value to change slant degree */ border-color: transparent transparent transparent white; /* change black to match the background color of the menu UL */ }
Read more: http://www.bloggerdersleri.com/2012/11/blogger-icin-css3-hareketli-dikey-menu.html#ixzz2H3N3d01T
skip to main |
skip to sidebar
Hakkımızda
Posted by
Rıdvan Aygün on 18:24 |
Leave a comment
Misyonumuz: Sizlere en kaliteli hizmeti sunup, eğlence dolu dakikalar geçirmeniz için elimizden gelenin en iyisini yapmaya çalışmaktır. Bu yolda sizlerin bizim için sunduğu eleştiri ve teklifler bizim yolumuzu aydınlatacaktır. Bu süreçte server yöneticileri ve server adminleri, sizlerin hizmetinde olacaktır. Vizyonumuz: Bu yolda zamanla sizlerin de desteğiyle Türkiye'de ve Dünya'da örnek gösterilecek serverlerin arasına girmek. Bu süreçte aramızda sizleri de görmek dileğiyle....
Hiç yorum yok:
Yorum Gönder