묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
서브메뉴와 주메뉴를 이용한 레이어 질문...
2003.06.12 13:04
<!-- 메뉴 스크립트 -->
<script>
function showSubMenu(obj) {
switch(obj) {
// 메뉴수에 맞추어 case 를 추가해 주시면 됩니다.
// pWidth 라는 것은 가상적으로 붙여준 이름으로
// 오른쪽 스크롤바에서 부터 서브레이어의 왼쪽 부분 까지의 길이기를 가리킵니다.
case 'SubMenu1' : pWidth = 550; break;
case 'SubMenu2' : pWidth = 465; break;
case 'SubMenu3' : pWidth = 378; break;
}
xPos = document.body.clientWidth - pWidth; // xPos 에 대한 값을 지정하는 부분입니다.
document.all[obj].style.posLeft = parseInt(xPos);// 여기서 posLeft 를 posRight 로 잡아주시면 다시 왼쪽 정렬이 됩니다.
document.all[obj].style.visibility = '';
}
function hideSubMenu(obj) {
document.all[obj].style.visibility = 'hidden';
}
</script>
<!-- 서브레이어 메뉴 출력 -->
<div id=SubMenu1 style="z-index:6; position:absolute; left:12px; top:115px; width:120; visibility: hidden" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')" > 서브 메뉴 1 내용 </div>
<!-- 주 메뉴 출력 -->
<a href="링크1" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')" onfocus=blur()><img src=메뉴1이미지 border=0 width=90 height=59 name="image1"></a>
이소스를 이용하여 서브메뉴를 하는 방법을 알게 됐습니다.
그런데 주메뉴 출력에서 이미지가 아닌 이미지 맵을 이용해서 하려면 어떻게 수정해야 하나요??
알려주세요
좀 자세히..
그리고 혹시 소스가 틀린점 있으면 지적좀..
아참 해상도에 관계없이 부메뉴 출력하는 방법도 좀...^^
<script>
function showSubMenu(obj) {
switch(obj) {
// 메뉴수에 맞추어 case 를 추가해 주시면 됩니다.
// pWidth 라는 것은 가상적으로 붙여준 이름으로
// 오른쪽 스크롤바에서 부터 서브레이어의 왼쪽 부분 까지의 길이기를 가리킵니다.
case 'SubMenu1' : pWidth = 550; break;
case 'SubMenu2' : pWidth = 465; break;
case 'SubMenu3' : pWidth = 378; break;
}
xPos = document.body.clientWidth - pWidth; // xPos 에 대한 값을 지정하는 부분입니다.
document.all[obj].style.posLeft = parseInt(xPos);// 여기서 posLeft 를 posRight 로 잡아주시면 다시 왼쪽 정렬이 됩니다.
document.all[obj].style.visibility = '';
}
function hideSubMenu(obj) {
document.all[obj].style.visibility = 'hidden';
}
</script>
<!-- 서브레이어 메뉴 출력 -->
<div id=SubMenu1 style="z-index:6; position:absolute; left:12px; top:115px; width:120; visibility: hidden" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')" > 서브 메뉴 1 내용 </div>
<!-- 주 메뉴 출력 -->
<a href="링크1" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')" onfocus=blur()><img src=메뉴1이미지 border=0 width=90 height=59 name="image1"></a>
이소스를 이용하여 서브메뉴를 하는 방법을 알게 됐습니다.
그런데 주메뉴 출력에서 이미지가 아닌 이미지 맵을 이용해서 하려면 어떻게 수정해야 하나요??
알려주세요
좀 자세히..
그리고 혹시 소스가 틀린점 있으면 지적좀..
아참 해상도에 관계없이 부메뉴 출력하는 방법도 좀...^^
<map>~~~</map>
뭐 이렇게 쓰면 될듯..
<a>~~</a> 부분은 이미지 맵 안에 넣으시구요.
근데 온마우스이벤트가 과연 이미지맵에서도 먹힐지..