댓글 2014-08-25
다른 레이아웃에 있는 메뉴 부분을 그대로 옮겨가고 싶을 떄.
- lifeto
- 2014.08.25 10:52:53
- 3
<div id="gnb_menu">
<ul class="gnb_ul">
<li loop="$main_menu->list=>$key1,$val1" class="active"|cond="$val1['selected']">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a>
<ul class="sub" cond="$val1['list']">
<div class="uparrow"></div>
<li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']">
<a href="{$val2['href']}" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a>
</li>
</ul>
</li>
</ul>
</div>
다음 소스는 xdt_simple_home2 레이아웃에 있는 메뉴 부분인데요.
이 부분을 그대로 제가 만든 레이아웃에 붙여넣고, conf/info.xml 파일을 교체했습니다.
그 후에 메뉴에 롤오버하면 나타나는 하위메뉴 레이어를 어떻게 적용할 수 있을까요?
도움 좀 부탁드립니다.
<!--%import("css/layout.css")-->
<!--%import("js/layout.js")-->
<!--@if($layout_info->banner_style=="y")-->
<!--%import("js/banner.js")-->
<!--%import("js/slider_touch.js")-->
<!--%import("css/slider.css")-->
이 것을 그대로 적용하면 오류가납니다;
태그목록
- 없음
첨부파일 목록
- 없음
목록으로 돌아가기
댓글 목록 [3]
-
-
/*menu*/
{
.header .header_menu { width:100%; height:70px; border-bottom:1px solid #ccc; }
.header .header_menu .menu { width:1000px; height:70px; margin:0 auto; }
.header .header_menu .menu .logo { width:250px; height:70px; float:left; }
.header .header_menu .menu #gnb_menu { height:70px; float:right; }
.header .header_menu .menu #gnb_menu ul { list-style:none; padding:0; margin:0; }
.header .header_menu .menu #gnb_menu .gnb_ul>li { position:relative; float:left; white-space:nowrap; margin:0 9px; }
.header .header_menu .menu #gnb_menu .gnb_ul>li>a { font-size:15px; font-weight:bold; color:#000; display:block; height:70px; line-height:70px; margin:0 15px 0 15px; }
.header .header_menu .menu #gnb_menu .gnb_ul>li>a:hover,
.header .header_menu .menu #gnb_menu .gnb_ul>li.active>a { color:#FF0E00; }
.header .header_menu .menu #gnb_menu .sub { display:none; position:absolute; top:56px; left:65%; min-width:90px; background:url('./../img/blackglass.png'); z-index:10; text-align:center; padding-bottom:10px; }
.header .header_menu .menu #gnb_menu .sub>li { height:20px; line-height:20px; padding: 1px 15px 0 15px; }
.header .header_menu .menu #gnb_menu .sub>li>a { color:#fff; }
.header .header_menu .menu .uparrow { width:0; height:0; border-left:9px solid transparent; border-right:9px solid transparent; border-bottom:9px solid #838383; margin:-9px auto 0 auto; margin-bottom:7px; }
CSS 적용하고, slider.css 를 외부링크로 불러오고, js 파일도 스크립트 로드했는데 아직도 이상태입니다.
http://lifeto.besaba.com/xe/
댓글 2014-08-25
-
.header .header_menu .menu { width:1000px; height:70px; margin:0 auto; }
이것만 봐도 이 css는 상단용이지 서브쪽에 걸어두는 css가 아님을 아실겁니다.
그냥 비슷한 형태의 레이아웃이 있으면 그걸 사용하시거나 아니면
비슷한 형태의 사이트가 있으면 css,js,html을 복사하신 다음 기본 html로 테스트 해 보시고 xe로 변환하는게 편하실겁니다.
댓글 2014-08-25
액션과 디자인 부분은
js와 css 부분입니다.