<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-ｅquiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Demo</title>
<link rel="stylesheet" type="text/css" href="css/menu_common.css"></link>
<script type="text/javascript" src="js/jquery/jquery-1.6.1.min.js"></script>
<script language="javascript">
var currentFocus = 1;
$(document).ready(function(){
// $('input')[0].focus();
$(document).keydown(function(e){
if (e.which == 83 && currentFocus < 5) { //S 아랫방향
e.preventDefault();
currentFocus++;
$('#hand'+currentFocus).slideDown(500);
}else if(e.which == 87 && currentFocus > 1) { //W 윗방향, tab키
e.preventDefault();
$('#hand'+currentFocus).slideUp(500);
currentFocus--;
// var preInput = inputs.get(inputs.index(this) - 1);
// if (preInput && preInput.id.indexOf('5') == -1) {
// preInput.focus();
// var idNum = $(this).attr('id').substring(2);
// $('#hand'+idNum).slideUp(500);
// }
//$('#hand li span').attr({class:'hand_on'});
}
});
});
//마우스 클릭방지
function mouse_down() {
if (event.button==2) {
//alert("마우스 오른쪽 버튼 클릭");
}
}
document.onmousedown=mouse_down;
function mouse_click() {
if (event.type=="mousedown") {
//alert("마우스 클릭");
}
}
document.onmousedown=mouse_click;
</script>
</head>
<body onselectstart="return false" ondragstart="return false" oncontextmenu="return false;">
<form>
<div id="wrap">
<ul>
<li class="ml15">
<ul id="hand">
<li id="hand5" class="hand_off"></li>
<li id="hand4" class="hand_off"></li>
<li id="hand3" class="hand_off"></li>
<li id="hand2" class="hand_off"></li>
<li><span id="hand1" class="hand_on"></span></li>
</ul>
</li>
<li class="ml15">
<ul class="focus">
<li><input type="image" id="id1" class="circle" /></li>
<li><input type="image" id="id2" class="circle" /></li>
<li><input type="image" id="id3" class="circle" /></li>
<li><input type="image" id="id4" class="circle" /></li>
<li><input type="image" id="id5" class="circle" /></li>
</ul>
</li>
<li class="ml15">
<ul class="arrow">
<li class="arrow_1"></li>
<li class="arrow_"></li>
<li class="arrow_"></li>
<li class="arrow_"></li>
<li class="arrow_"></li>
</ul>
</li>
<li class="balloon">
</li>
</ul>
</div>
</form>
</body>
</html>
'개발 > jsp' 카테고리의 다른 글
| 메일선택 (0) | 2020.02.06 |
|---|---|
| jQuery Selector (0) | 2020.02.06 |
| 동적 움직임 추가 w,s키 사용 (0) | 2020.02.06 |
| css 예시 (0) | 2020.02.06 |
| convert + substring, replace(convert) (0) | 2020.02.06 |