묻고답하기
펼침목록메뉴 "다시" 질문드립니다.
2007.03.23 14:13
다시 질문 드립니다. 글로만 설명하자니 전달이 잘 안되는 것 같아서요.
위에 그림에서처럼 펼침목록으로 원하는 메뉴를 선택 후 옆에 이동 버튼을 누르면
페이지가 전환되는 경우에서의 타겟지정(타겟명=center)을 어떻게 해야하는지 알고 싶습니다.
그리고 밑에 뒤로, 새로고침, 앞으로 버튼도 위와 같은 곳을 타겟으로 지정하고 싶은데 방법을 모르겠네요.
고수분들의 많은 조언 부탁드립니다.
그럼 좋은하루 되세요. ^^
댓글 8
-
김연
2007.03.23 18:58
-
김연
2007.03.23 19:02
아래에 먼저 적으신 글을 살펴보니 메뉴가 있는 페이지는 이동이 없어서 선택된 상태가 그대로다...라고 쓰셨는데...
메뉴가 포함되어 있는 문서는 바뀌지 않는것 같아서 답글 드렸던건데...
메뉴가 포함된 문서 전체가 다른 문서로 바뀌는 것인가 궁금해서요. -
강원
2007.03.24 07:30
메뉴가 있는 프레임은 변동이 없습니다. 메뉴에 모든 이동은 아이프레임에만 적용이 되구요.
말씀하신데로 전체 페이지가 전환된다면 타겟지정이 필요 없겠죠.
아래 적어주신 소스는 타겟지정이 아이프레임으로 되어있고
메뉴가 있는 곳은 바뀌지 않는다는 것은 맞는데요.
제가 원하는 것을 펼침목록으로 메뉴를 지정 후 옆에 "이동" 버튼을 눌러서 지정한 타겟의
페이지가 전환되는 것 입니다.
그런데 적어주신 소스에는 이동버튼이 없이 펼침목록메뉴로만 이동이 되더군요.
펼침목록은 그냥 원하는 링크를 선택만해주는 곳이고 페이지 전환은 이동버튼을 눌러야 변하게
되는 뭐 그런 것을 원합니다.
펼침목록 메뉴의 단점이라고 생각되는 것이 메뉴를 선택 후 메뉴가 있는 페이지가 변동이 없다면
선택했던 메뉴가 계속 선택되어 있잖아요. 그 상태에서 마우스휠이라도 움직이면 메뉴가
다른 메뉴로 변해버리는 현상 때문에 옆에 이동버튼을 눌러서 이동하게되면 그 활성화 된 것을
풀 수 있어서 이런 방법을 선택했습니다.
그리고 아래에 있는 뒤로, 새로고침, 앞으로 버튼도 아이프레임에만 적용해야하는데
보통 링크 할 때 방법으로는 안되는 것 같아서요.
글로 설명하자니 굉장히 어려움이 있네요...ㅠ.ㅠ{조언 부탁드립니다.) -
김연
2007.03.25 02:11
아래의 예를 다시 한번 페이지로 확인하시구요...
말씀하신것 처럼 선택하면 포커스가 선택한 메뉴에 남아있지 않습니다.
외부로 강제로 포커스를 이동시키기 때문에 그럴 염려는 없을거구요..
아이프레임 안에 페이지 이동하는것도 확인해보시면 되겠습니다.
<html>
</head>
<script language="javascript">
<!--
function gothere(){
var goURL = document.getElementById('example').options[document.getElementById('example').selectedIndex].value;
if(goURL != 'no') {
Tframe.location.href = goURL;
document.getElementsByTagName('body').item(0).focus();
}
}
//-->
</script>
</head>
<body>
<select id="example" onChange='gothere()'>
<option value='no'>메뉴</option>
<option value="a.html">메뉴1</option>
<option value="b.html">메뉴2</option>
</select>
<br>
<input type=button value='뒤로' onclick="Tframe.history.go(-1)">
<input type=button value='새로고침' onclick="Tframe.location.reload()">
<input type=button value='앞으로' onclick="Tframe.history.go(+1)">
<br><br>
<iframe id='Tframe' src=''></iframe>
</body>
</html> -
김연
2007.03.25 02:15
참고로 말씀드리면 사용자에게 메뉴를 선택하고 버튼을 한번더 누르게 하는것도 사실은 그리 좋은 일은 아니기 때문에
버튼을 안쓰는 방향으로 해드린겁니다. 넣을 수도 있지만요.
사용자 입장에선 한번더 누르는것도 불편할 수 있습니다. -
김연
2007.03.25 02:53
만약 메뉴를 클릭하고 메뉴만 초기화 되도록 하시고 싶으시다면 이런식으로 바꿔서 해보세요.
<html>
</head>
<script language="javascript">
function gothere(){
var goURL = document.getElementById('example').options[document.getElementById('example').selectedIndex].value;
if(goURL != 'no') {
Tframe.location.href = goURL;
selectChange();
document.getElementsByTagName('body').item(0).focus();
}
}
function selectChange() {
var slDiv = document.getElementById('selectDiv');
var str;
// 아래를 보시면 메뉴를 쉽게 추가하실 수 있습니다.
// str += "<option='이동페이지'> 메뉴명 </option>"; 와 같이 작성하셔서 <option> 들을 순서대로 작성하세요.
str = "<select id='example' onChange='gothere()'>";
str += "<option value='no'>메뉴</option>";
str += "<option value='a.html'>메뉴1</option>";
str += "<option value='b.html'>메뉴2</option>";
str += "</select>";
slDiv.innerHTML = str;
}
window.onload = selectChange;
</script>
</head>
<body>
<div id='selectDiv' style='margin:0'></div>
<br>
<input type=button value='뒤로' onclick="Tframe.history.go(-1)">
<input type=button value='새로고침' onclick="Tframe.location.reload()">
<input type=button value='앞으로' onclick="Tframe.history.go(+1)">
<br><br>
<iframe id='Tframe' src=''></iframe>
</body>
</html> -
강원
2007.03.26 14:36
감사합니다. 덕분에 다음 단계로 넘어갈 수 있겠네요. ^^
친절하게 설명해 주셔서 정말 감사합니다.
^^ 좋은하루 되세요. -
sunholic
2007.03.26 23:59
제가 실력이 부족해서 좋은 코드는 못됩니다.
조금더 생각해서 보완하시면 더 좋은 코드가 될것 같습니다.
즐거운 저녁되세요.
a.html 에서 b.html 로 이동하면서 메뉴에 선택된 문서(예:c.html)가 b.html 의 아이프레임에 불러들이게 되는걸 말씀하시는건지요.
페이지가 전환되는 경우 타겟지정이란 의미가...위에 제가 적은 의미가 맞는지 알아야 말씀을 드릴수 있을것 같네요.