스크롤시 주메뉴 상단고정하는방법 > 시즌3 팁 & 테크

/eyoom/theme/basic/skin_bs/안에 임의로 nav/fixed 폴더를 생성합니다. 그럼 경로가 이렇게되죠!!

/eyoom/theme/basic/skin_bs/nav/fixed/ 안에다가 첨부한 파일을 업로드합니다.

/eyoom/theme/basic/layout/head_bs.html 파일을 열어 아래의 코드를 적당한곳(상단)에 추가합니다.

<link rel="stylesheet" href="../skin_bs/nav/fixed/style.fixed.css" type="text/css" />
<script language='JavaScript' src='../skin_bs/nav/fixed/fixed.js'></script>

아래코드를 보시면 <nav id="topMenu" class="gnb"> 이러한 코드가 있는데 같은위치에 추가시켜줍니다.

동일한 위치에 추가시켜야 메뉴가 깨지지않습니다.

<!--------------- Header Banner 영역 시작 { --------------->
                <!-- 안내: 테마 image 폴더 내 이미지파일을 업로드 후 아래 a태그 링크설정 및 이미지 경로의 이미지 파일명 수정, 불필요 시 삭제 -->
    
                <div class="header-banner pull-right hidden-sm hidden-xs">
                 <a href="#" target="_blank"><img src="../image/header_banner.png" class="img-responsive"></a>
             </div>
                <!-- 안내: 보여지는 이미지 크기는 209 x 50 픽셀입니다. 선명도 최적화를 위해 694 x 166 픽셀 사이즈로 image 폴더에 업로드 하시길 권합니다. -->
                <!--------------- } Header Banner 영역 끝 --------------->
            </div>

            <div class="clearfix"></div>

            <div class="collapse navbar-collapse navbar-responsive-collapse">

   <nav id="topMenu" class="gnb"> //여기부분입니다.


                <div class="container">
  
                    <ul class="nav navbar-nav">
               
                        <!-- Home -->
                        <li class="{? defined('_INDEX_')}active{/} home-menu">
                            <a href="{C.G5_URL}{? _is_member && eyoomer.main_index != 'index'}/?home{/}"><i class="fa fa-home"></i> 메인</a>
                        </li>
                        <!-- End Home -->

그다음에 또 아래와 같이 </nav> 라고 끝을 맺어주는 코드를 추가합니다.역시 같은위치에 넣어주셔야 메뉴가 안깨집니다.

if (cnt > 1) {
          alert("빠른 검색을 위하여 검색어에 공백은 한개만 입력할 수 있습니다.");
          f.stx.select();
          f.stx.focus();
          return false;
         }
         return true;
        }
        </script>
                            </div>
                        </li>
                        <!-- End Search Block -->
                    </ul>
                </div>
            </div><!--/navbar-collapse-->
        </div>
        <!-- End Navbar -->

 </nav> //여기 부분입니다.


    </div>
    <!--=== End Header ===-->

    <!--{? defined('_INDEX_') || defined('_EYOOM_MYPAGE_')}-->
    <!--{:}-->
    <!--=== Board Title ===-->

이제 /eyoom/theme/basic/skin_bs/nav/fixed/style.fixed.css 파일을 본인 메뉴색상에 맞게 수정하시면됩니다.

p.s 안된다고 머라고 하기 없기^^ 잘되면 덧글 남기기^^

출처 & 참고 사이트 : 그누보드 사이트