2013-06-12 2 views
1

작은 문제가 있습니다. 중심에 로고가있는 동적 메뉴를 감싸려고합니다. 하나의 아이디어는 두 부분으로 나뉘어있는 메뉴 (nav 태그 안에있는 ul)를 분리하고 jQuery를 사용하여 균형을 맞추기 위해 로고 div 주위로 그 부분을 감싸는 것입니다. 하지만 어떻게 해야할지 모르겠다. 나는 로고를 절대 위치에 두었고 n 번째 요소에 margin-left를 추가하려고 시도했지만 동적 메뉴를 고려하여 항상 작동하지는 않습니다. 여기 반으로 ul을 나누고 div 주위에 두 부분을 감습니다. (동적 메뉴 내부의 로고)

마크 업을 가진 바이올린의 : http://jsfiddle.net/VjzRV/

HTML

<div id="logo"><a href="#"> 
         <h1>Logo</h1> 
        </a></div><!-- end #logo --> 

              <nav id="main-menu" class="clearfix"> 
         <ul id="top-menu"> 
          <li><a id="menu-763" target="_blank" class="link" href="http://google.com">LINK</a> 
               <ul></ul> 
              </li><li><a id="menu-761" data-target="#page-761" class="mensection">Media</a> 
               <ul><li><a id="menu-760" data-target="#page-760" class="mensection">Content</a></ul> 
              </li><li><a id="menu-759" data-target="#page-759" class="mensection">Content</a> 
               <ul></ul> 
              </li><li><a id="menu-762" data-target="#page-762" class="mensection">Media</a> 
               <ul></ul> 
              </li> 
              <li><a id="menu-762" data-target="#page-762" class="mensection">Media</a> 
               <ul></ul> 
              </li> 

              <li><a id="menu-758" data-target="#page-758" class="mensection">Content</a> 
               <ul></ul> 
              </li>         <li><a id="menu-contacto" data-target="#contact-me" class="mensection">Contacto</a></li> 
                 </ul> 
        </nav><!-- end #main-menu --> 
+0

관련 HTML/CSS를 제공하거나 더 나은 그냥 한 http://jsfiddle.net/ – sinisake

+0

에 설정하십시오 : –

+0

을 그 http://jsfiddle.net/VjzRV/2/? – sinisake

답변

1
$(function(){ 
    var liCount = $('#top-menu>li').length/2 -1; 
    $('#top-menu>li').eq(Math.floor(liCount)).append("<li><div id='logo'><a href='#'><h1>Logo</h1></a></div></li>"); 

}); 

내가 여기에 한 # 상단 메뉴의 내부 li의 수를 계산이다 그래서, 가 차감 한 때문에 EQ 0 기반입니다. 다음 새 # li 안에 #logo를 추가하고 li의 중간 바로 뒤에 놓습니다.

당신이 li의 짝수가 있다면 그것은 더 나은 모양

+0

완벽하게 작동합니다! 답변을 받아 들여야합니다. – Warface