2014-05-17 4 views
0

하위 메뉴에 액세스하는 동안 고정 된 jquery mmenu 상단에 로고/이미지를 추가 할 수 있는지 알고있는 사람이 있습니까?jquery 메뉴 상단에 고정 된 로고를 추가 하시겠습니까?

나는 머리글 부가 기능을 사용해 보았지만 그저 텍스트만으로도 작동하도록하는 행운이 없었습니다.

도움이 될 것입니다.

감사합니다.

답변

2

mmenu는 모든 태그를보고 복제하므로, pageload 이후에 앞에 추가하는 것이 가장 좋습니다. 예를 들어, 내 코드는 다음과 같습니다. (당신은 내 대부분의 옵션을 무시하고 자신의로 대체 할 수있다.)이와

  $(document).ready(function() { 
 
      $("#menu").mmenu({ 
 
       "classes": "mm-slide mm-light", 
 
       "header": true, 
 
\t \t \t "": true, 
 
       "searchfield": { 
 
        "placeholder": "Search", 
 
        "add": true, 
 
        "search": true 
 
       } 
 
     }); 
 
      
 
    var VarName = "<div id='forStyling'><img src='images/globe.png' alt='' /><a href='/'>Company Home</a></div>"; 
 
    $('nav#menu').prepend(VarName); 
 
    });
만 문제를, 그들은 또한 절대적으로 그 mmenu 내에서 요소를 배치한다. 그래서 나는 그것을 모두 내려 놓기 위해 약간의 주문 CSS를 추가해야했다. 내 예에서 로고는 내가 이것에 대한
\t \t .mm-menu > .mm-search {top:40px;} 
 
\t \t .mm-menu.mm-hassearch .mm-header {top:90px;} 
 
\t \t .mm-menu.mm-hasheader.mm-hassearch > .mm-panel.mm-list {padding-top:140px;}

1

감사 (패딩 포함) 생각 40px 높이이었다. 나는 똑같은 질문을했고 완벽하게 작동했습니다. 답변 이후로 CSS 클래스가 변경된 것을 보았습니다.

.mm-panels{ 
top:100px; 
} 

사용자 정의 DIV가 노출됩니다.

1

당신은 JS 이하로 사용하여이 작업을 수행 할 수 있습니다

<script type="text/javascript"> 
      $(function() { 
       $('nav#smenu').mmenu({ 
        navbars  : [ 
         { 
        height : 4, 
        position : 'top', 
        content  : [       
          '<div id="logo" class="site-logo"><img src="../logo.png"></div>', 
           'prev', 
           'title' 
          ], 
        } 
        ] 
       }); 
      }); 
</script> 

을 까다로운 당신의 최고 이상과 같은 HTML 형식의 내용, 설정 위치가 있습니다 : 상위 1 ~ 4, 1 = 최고, 및 높이 : 40px , 4 = 상단 : 160 픽셀.

이 코드는 사용자의 자세에 맞지 않을 수도 있지만 이것이 작동하는 방식입니다.