묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
나라디자인 CSS Navigation Bar 표시오류좀 봐주세요.
2010.12.10 13:52
나라디자인 CSS Navigation Bar
http://www.xpressengine.com/?mid=download&category_srl=18322950&package_srl=19270268
에 있는 것을 참고하여 아래와 같이 만들었습니다.
아무것도 없는 빈 페이지에 위젯만을 넣었는데요.
서브메뉴가 위 그림처럼 메뉴부분을 침범하네요.
당연히 검정색의 맨아래에 딱 맞게 나와야하는데 말이죠.
참고페이지(http://naradesign.net/wp/2010/02/11/1185/) 에 있는 메뉴처럼 말이죠.
그리고 top2의 하위메뉴는 아무것도 없는데도 아래방향화살표 모양이 보이네요.
뭐가 문제인건지...
css파일을 수정해야 하는건가요? 도움좀 부탁드려요.
메뉴구성을 추가합니다.
잘못된건 없는거죠?
혹시 core의 버전과 관련이 있을수 있을까요? 최신버전으로 했거든요.
태그 연관 글
- [2018/03/17] 묻고답하기 CSS ㅡ divA 안에있는 하위 divB 의 크기를 divA 보다 넓게 보이게 하려면 *2
- [2016/09/13] 묻고답하기 제목에 html, css 가능하도록 하기? *2
- [2016/06/30] 묻고답하기 xe 1.4.0버전 사용중입니다 *1
- [2016/01/05] 묻고답하기 ie10, 11번전 css문제
- [2015/07/16] 묻고답하기 widget을 감싸고 있는 박스에 미디어쿼리를 넣고 싶습니다 *2
댓글 2
-
ForHanbi
2010.12.10 15:17
-
울뜨라
2010.12.10 16:03
서브메뉴겹치는 것은 top값을 변경하여 해결했습니다. 감사드리구요. 하위메뉴가 없음에도 화살표가 나타나는 것과 관련하여 질문내용을 추가하였습니다. 다시 한번 봐주시면 고맙겠습니다. -
ForHanbi
2010.12.10 16:40
// Menu var menu = $('div.menu'); var major = $('div.major'); var li_list = major.find('>ul>li'); // Selected function onselectmenu(){ var myclass = []; $(this).parent('li').each(function(){ myclass.push( $(this).attr('class') ); }); myclass = myclass.join(' '); if (!major.hasClass(myclass)) major.attr('+ 'class','major').addClass(myclass); } // Show Menu function show_menu(){ t = $(this); li_list.removeClass('active'); t.parent('li').addClass('active'); // IE7 or IE7 documentMode bug fix if($.browser.msie) { var v = document.documentMode || parseInt($.browser.version); if (v == 7) { var subWidth = t.next('div.sub'+ ').eq(-1).width(); t.next('div.sub').css('width',subWidth); } } } li_list.find('>a').click(onselectmenu).mouseover(show_menu).focus(show_menu); // Hide Menu function hide_menu(){ li_list.removeClass('active'); } menu.mouseleave(hide_menu); li_list.find('div.sub>ul').mouseleave(hide_menu); //icon major.find('div.sub').prev('a').find('>span').append('<span class="i"></span>');
위 부분이 정찬명님의 메뉴에 있던 js 부분이고요.거기서 화살표를 넣는 js는major.find('div.sub').prev('+ 'a').find('>span').append('<span class="i"></span>'+ ');
이 부분입니다.
간단하게 말해서 major라는 클라스 이름이 있는 div안에 sub라는 클라스(하위 메뉴입니다)의 div가 있으면
그 앞 <a><span></span></a> 뒤에 <span class="i"></span> 을 더 붙혀라.
그리고 화살표는 <span class="i"></span>의 백그라운드 이미지 입니다.
즉 html 구조가 위의 조건에 맞게 작성되었다면 화살표는 옳바르게 작동될거라 봅니다.
솔직히 작업하시는 html을 안본 이상은 정확하게 원인을 파악하기 힘듭니다.
글쓴이 | 제목 | 최종 글 |
---|---|---|
XE | 공지 글 쓰기,삭제 운영방식 변경 공지 [16] | 2019.03.05 by 남기남 |
아라비카21 | 불러온 외부페이지에서 css/js가 적용되질 않습니다ㅠㅠ [1] | 2011.11.17 by 이끼다 |
펜잘 | 페이지에서 css를 적용할때 테이블에는 css가 적용이 안되나요? [1] | 2011.05.01 by 능소니 |
해피지영 | css 드랍다운 메뉴 z-index 문제인가요...? 한번 봐주세요~ [1] | 2011.04.28 by 송동우 |
울뜨라 | 나라디자인 CSS Navigation Bar 표시오류좀 봐주세요. [2] | 2010.12.10 by ForHanbi |
바보당근 | 관리자 레이아웃편집 화면의 CSS창 문의... [1] | 2010.10.05 by ForHanbi |
파파민 | 1.4.2.3 업데이트후 일부 CSS 인식 못합니다. [1] | 2010.07.21 by 구가 |
웰빙샵 지영 | CSS hack 사용법을 구체적으로...부탁드려요~~~ [3] | 2009.09.10 by 웰빙샵 지영 |
웰빙샵 지영 | 2차메뉴시 롤오버시 뜨는 이미지 위치 변경 CSS 문의입니다 [1] | 2009.09.06 by 궁금이2 |
웰빙샵 지영 | css valign middle 정렬 어떻게 코딩하나요? [1] | 2009.08.01 by MX |
Jiyoung540 | 외부페이지 만드는데...이미지 위치를 원하는데로...css 코딩이... [2] | 2009.06.14 by Jiyoung540 |
장윤성996 | w3c 마크업 테스트를 꼭 통과하고 싶었습니다. | |
쿨김 | CSS menu에 대한질문 | |
bluepark | CSS 를 불러 오지 못하는 경우 [8] | 2020.03.15 by bluepark |
김민787 | 어느 css를 수정하면 되나요 ? [2] | 2008.05.20 by 김민787 |
슈퍼맨~ | 블랙으로 만들려고 삽질중인데 도와주세요. [3] | 2008.04.21 by artlab |
푸마지우개 | 게시판 CSS 수정에 대해서 질문.. [1] | 2008.03.23 by 똑디 |
사이트 주소 올려 주시면 파악해 보겠습니다.
아니면 간략한 설명...
하위 메뉴가 absolute로 되어 있을겁니다. 그리고 위치가 top:얼마 로 되어 있을 건데 그 얼마값을 바꾸시면 될겁니다.
그리고 화살표 표시는 js에서 잡아준건데 그게 하위메뉴가 있을시에만 span을 더 추가해서 백그라운드 이미지로 추가하는 방식이라..
하위메뉴가 없으면 나올 수가 없는건데
모르겠네요.