<div id="akigesdan">
        <ul id="menu">
            <li><a class="nasedamugas" href="#">Главная</a></li>
                <ul>
<li><a href="#">Projects</a>
                </li>
                </ul>
            
            <li><a class="menu selected"href="#">Шаблоны</a>
                <ul>
                <font style="float:left; ">
                  <br><br>
                  ZorNet.Ru <br><br>
               Можете увидеть больше от этого пользовател<br><br>
                  Исправлено вертикальное меню слев <br><br>
                  CSS и Javascript найти оригинальный код на Codepen<br><br>
                </font>
                  
                  
                  </li>
                 
                </ul>
            </li>
            <li><a  href="#">Дизайн</a></li>
     </ul>
</div>

    background:#f8f8f8 url(http://www.leeonconsultancy.com/images/audrina%20web%20background.jpg) repeat-x;
}

/* stil sıfırlama işlemi */
#akigesdan ul, #akigesdan ul li{
    margin:0;
    padding:0;
    list-style:none;
}

#menu{
    background:#272727;
    width:110px;
    height:100%;
  position:fixed;
  border-right:4px #a00 solid;
}

#akigesdan ul li{font: 14.5px arial ;
    background-color:#272727;
    width:110px;
    cursor:pointer;
    text-align:center;
  
}

#akigesdan ul li:hover {
    
}

#akigesdan ul li a{
    padding-top:20px;
    padding-bottom:20px;
    color:#555555;
    display:inline-block;
    text-decoration:none;
}

#akigesdan ul li a.selected{
  color:#ddd;   
}
#akigesdan ul li a:hover{
    color:#a00;
    transition:color 0.3s ease;
    -o-transition:color 0.3s ease;
    -webkit-transition:color 0.3s ease;
    -moz-transition:color 0.3s ease;
}

#akigesdanul li a:hover:after {
    content: "  ";
    display: inline-block;
    border-bottom: 0.8em solid transparent;
    border-left: 0.8em solid transparent;
    border-right: 0.8em solid #a00;
    border-top: 0.8em solid transparent;
    height: 0px;
    margin-top: -2px;
    position: absolute;
    left: 91px;
    width: 1px;
    transition:border-right 1s ease;
    -o-transition:border-right 1s ease;
    -webkit-transition:border-right 1s ease;
    -moz-transition:border-right 1s ease;
}

#akigesdan ul li a.nasedamugas:hover:after {
    border-right: 0.8em solid transparent;
    transition:none;
    -o-transition:none;
    -webkit-transition:none;
    -moz-transition:none;
}

#akigesdan ul li ul{
    position:absolute;
    display:block;
    visibility:hidden;
    height:100%;
    background-color:transaprent;
    width:0px;
    color:#fff;
    
}

#akigesdanul li ul li{
    color:#fff;
    background:transparent;
    padding:15px;
}

#akigesdan ul li:hover ul{
    left:110px;
    top:0px;
    display:block;
    visibility:visible;
    width:300px;
    background-color:#a00;
    transition:background-color 0.5s ease;
    -o-transition:background-color 0.5s ease;
    -webkit-transition:background-color 0.5s ease;
    -moz-transition:background-color 0.5s ease;
    
}

$(document).ready(function () {
    $('ul > li > ul').css('height', $(window).height() + 'px');
    $('#menu').css('height', $(window).height() + 'px');
});