물론,
해당 메뉴자료도 [소스 & 가이드] 또는 휴게소 홈페이지 Menu 분류에 있습니다. 참조하고.....
이전질문에 대한 답변은
동일한 클립아트 이미지를 쓰면 프레임간 이미지 단차를 거의 줄일 수 있습니다..
현재 메뉴를 수정해서 디자인 해 보세요
- 어드바이드 -
설명을 잘 읽고 그대로 따라서 수정합니다(좋은말 할때... - -)
1. 먼저 프레임을 이렇게 수정해 준다.
<HTML>
<head><TITLE> </TITLE>
</HEAD>
<frameset cols="200,1*" frameborder=0 marginwidth=0 marginheight=0>
<frame src="p1.htm" name=menu scrolling="no">
<frame src="main.htm" name=main scroling="auto">
</frameset>
<noframes>
이 페이지는 프레임을 볼 수 있는 브라우져가 필요합니다.
</noframes>
</HTML>
이렇게 메뉴전체가 펼쳐지는 폭 만큼 프레임 크기를 준다.
※ 위에서 오른쪽 문서인 main.htm 을 하나 만들어 놓는다
예제) main.htm 문서소스
<html>
<body>
</body>
</html>
그냥 이렇게(나중에 내용을 꾸며 넣을 것...)
2. 두번째 : 메뉴 컨테이너가 펼쳐지는 폭이 비교적 크므로 왼쪽 프레임을 너무 크게 주지않도록(뵈기 싫으므로..)
하기 위해 메뉴 폭을 수단과 방법을 가리지 않고 가능한 한 좀 줄여준다
★방법 : 메뉴의 속성(여백)과 텍스트 크기를 작게준다.
(HMenu.css 파일을 열어 아래처럼 수정)
- HMenu.css 소스 -
.menu {position: absolute;
font-family: MS Sans Serif; font-size: 9pt;
background-color: menu; color: menutext;
border: 2px threedhighlight outset;
cursor: default; visibility: hidden; line-height: 140%;}
.visibleMenu {position: absolute;
font-family: MS Sans Serif; font-size: 9pt;
background-color: menu; color: menutext;
border: 2px threedhighlight outset;
cursor: default; visibility: visible; line-height: 140%;}
.menuItem {color: menutext; background-color: menu; font-size:9pt;
padding-left: 5px; padding-right: 5px;
text-decoration: none;}
.menuItemOver {color: highlighttext; background-color: highlight;
padding-left: 5px; padding-right: 5px; color:red;
text-decoration: none;}
.menuItemOver A {color: highlighttext; background-color: highlight;
padding-left: 5px; padding-right: 5px; color:yellow;
text-decoration: none; cursor: default;}
.menuItem A {color: menutext; background-color: menu;
padding-left: 5px; padding-right: 5px;
text-decoration: none; cursor: default;}
.more {font-family: WebDings; text-align: right; position: absolute;}
3. 세번째로 HMenu.js 자바스크립트 파일을 메모장으로 열어서
function setupMenu(menu) 함수부분에서....
tMenu.style.pixelWidth += 20; 요 부분의 값을 20 대신 10으로 수정해 놓는다.
(이 부분 역시 메누뉴의 여백에 대한 속성임)
4. 마지막으로 메뉴의 링크에서 타깃을 주는 방법은
서브메뉴를 포함하지 않는 주메뉴에는 바로 타깃을 주고
서브메뉴가 포함되는 주메뉴에는 주메뉴에 타깃을 주지않고
<div id="menuItem1_2_1" class="menuItem"><a href="http://..." target="main">음료</a></div>
<div id="menuItem1_2_2" class="menuItem"><a href="http://..." target="main">칵테일</a></div>
<div id="menuItem1_2_3" class="menuItem"><a href="http://..." target="main">맥주</a></div>
<div id="menuItem1_2_4" class="menuItem"><a href="http://..." target="main">안주</a></div>
<div id="menuItem1_2_5" class="menuItem"><a href="http://..." target="main">식사</a></div>
이와같이 서브메뉴에 타깃을 준다...
- 끝.........
--------------------- [원본 메세지] ---------------------
마우스 오른쪽 버튼을 누르면 인터넷 기본설정으로 뜨는 메뉴있잖아요.
(뒤로, 앞으로, 배경화면저장...)
그건 프레임에 안 걸리고 잘 보이던데...
그렇게 할 수 있는 방법은 없을까요???
프레임을 나누면 벽지나 아이콘, 상위 바 등을 연결되게 디자인 하기가 힘들 것 같아서 되도록이면 지금처럼 메뉴를 보이고 싶거든요.
운영자님이 설명하신건 페이지를 본 다음
다시 메뉴바를 클릭해서 다단계 메뉴를 볼수 있는 페이지를 다시 열어야 하는 방법 같은데요... 아닌가...
-_-a;;; (긁적...)
여기 참고...
http://myhome.naver.com/assfool/shooin/jario/frame_.htm
카페 게시글
?? 태그 Q & A
<font color=red>답변
Re:근데여...^^;;
운영자
추천 0
조회 16
02.02.20 15:31
댓글 0
다음검색