قائمة رئيسية جانبية منزلقة إضافة مميزة جدا لمدونات البلوجر

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>

.menu-right{top:226px;}}/**/.menu-right{background:none repeat scroll 0 0 #fff;border-left:1px solid #F0F0F0;top:166px;width:41px;position:absolute;z-index:9999999;}.menu-right ul li{border-bottom:1px solid #EBEBEB;box-shadow:0 1px 0 0 #FFFFFF;}.menu-right .na{/**/width:0;right:41px;padding:0;position:absolute;overflow:hidden;/**/font-family:droid arabic kufi;font-size:16px;font-weight:bold;letter-spacing:0.6px;white-space:nowrap;line-height:39px;/**/-webkit-transition:0.25s;/**/-moz-transition:0.25s;transition:0.25s;}.menu-right.ss:hover .ka{color:#FFFFFF;}.menu-right .ss{display:block;height:39px;text-align:center;position:relative;width:41px;z-index:99999;/**/}/**/.menu-right .ss:hover .na{width:auto;padding:0 20px;overflow:visible;}/**/.menu-right .hom:hover{background:none repeat scroll 0 0 #00BAC7;}.menu-right .hom .na{background:none repeat scroll 0 0 #00BAC7;}.fa-home{color:#00BAC7;}/**/.menu-right .win:hover{background:none repeat scroll 0 0 #8F8898;}.menu-right .win .na{background:none repeat scroll 0 0 #8F8898;}.fa-windows{color:#8F8898;}/**/.menu-right .cog:hover{background:none repeat scroll 0 0 #43AF95;}.menu-right .cog .na{background:none repeat scroll 0 0 #43AF95;}.fa-cogs{color:#43AF95;}/**/.menu-right .goo:hover{background:none repeat scroll 0 0 #F3594D;}.menu-right .goo .na{background:none repeat scroll 0 0 #F3594D;}.fa-google-plus{color:#F3594D;}/**/.menu-right .des:hover{background:none repeat scroll 0 0 #5792B2;}.menu-right .des .na{background:none repeat scroll 0 0 #5792B2;}.fa-desktop{color:#5792B2;}/**/.menu-right .unl:hover{background:none repeat scroll 0 0 #F6C231;}.menu-right .unl .na{background:none repeat scroll 0 0 #F6C231;}.fa-unlock-alt{color:#F6C231;}/**/.menu-right .che:hover{background:none repeat scroll 0 0 #C61F89;}.menu-right .che .na{background:none repeat scroll 0 0 #C61F89;}.fa-check-square{color:#C61F89;}/**/.menu-right .thu:hover{background:none repeat scroll 0 0 #F75940;}.menu-right .thu .na{background:none repeat scroll 0 0 #F75940;}.fa-thumbs-o-up{color:#F75940;}/**/.menu-right .dow:hover{background:none repeat scroll 0 0 #4aa3df;}.mdwanblog {margin-top: 0;position: fixed;top: 0!important;z-index: 9999999;}.menu-right .dow .na{background:none repeat scroll 0 0 #4aa3df;}.menu-right .fa-cloud-download{color:#4aa3df;}/**/.menu-right .arc:hover{background:none repeat scroll 0 0 #34495e;}.menu-right .arc .na{background:none repeat scroll 0 0 #34495e;}.arc .fa-archive{color:#34495e;}/**/.menu-right .exc:hover{background:none repeat scroll 0 0 #f1c40f;}.menu-right .exc .na{background:none repeat scroll 0 0 #f1c40f;}.fa-exclamation-triangle{color:#f1c40f;}/**/.menu-right .plu:hover{background:none repeat scroll 0 0 #9b59b6;}.menu-right .plu .na{background:none repeat scroll 0 0 #9b59b6;}.fa-plus{color:#9b59b6;}.fa-minus{color:#9b59b6;}/**/.menu-right .ka{font-size:21px;line-height:36px;transform:rotate(0deg);transition:all 0.5s ease 0s;}.menu-right .na{color:#FFFFFF;}.menu-right .ss:hover .ka{color:#FFFFFF;transform:rotate(360deg);transition:all 0.5s ease 0s;}

<div class="menu-right mdwanblog" style="height: 2681px;"><ul><li><a class="ss hom" href="/"><i class="ka fa fa-home"></i><span class="na">الرئيسية </span></a></li><li><a class="ss win" href="#"><i class="ka fa fa-windows"></i><span class="na">الويندوز </span></a></li><li><a class="ss cog" href="#"><i class="ka fa fa-cogs"></i><span class="na">البرامج </span></a></li><li><a class="ss goo" href="#"><i class="ka fa fa-google-plus"></i><span class="na">جوجل </span></a></li><li><a class="ss des" href="#"><i class="ka fa fa-desktop"></i><span class="na">انترنت </span></a></li><li><a class="ss unl" href="#"><i class="ka fa fa-unlock-alt"></i><span class="na">الحماية </span></a></li><li><a class="ss che" href="#"><i class="ka fa fa-check-square"></i><span class="na">شروحات عامة </span></a></li><li><a class="ss thu" href="#"><i class="ka fa fa-thumbs-o-up"></i><span class="na">مواقع مفيدة </span></a></li><li><a class="ss dow" href="#"><i class="ka fa fa-cloud-download"></i><span class="na">تحميل </span></a></li><li><a class="ss arc" href="/p/archive.html"><i class="ka fa fa-archive"></i><span class="na">الارشيف </span></a></li><li><a class="ss exc" href="/404"><i class="ka fa fa-exclamation-triangle"></i><span class="na">خطا 404 </span></a></li></ul></div>