这是页面上的一个虚拟键盘,我想实现的是当我在电脑的键盘上按键后,虚拟键盘上的相对应的键会有不同的显示效果(调用一个css)(虚拟键盘上的每一个小键都是一个图片),就是当我按下不同的按键,页面上相对的键所在的div就会调用同一个css
虚拟键盘上的每个控件都增加keycode属性,然后document.onkeydown
获取时间的keycode属性后获取控件添加个样式,过100ms再移除什么的
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<style>
.focus{background:#f00}
</style>
<div id="dvKB">
<input type="button" value="ESC" kc="27" /> <input type="button" value="A" kc="65" /> <input type="button" value="B" kc="66" /> <input type="button" value="C" kc="67" />
</div>
<script>
$(document).keydown(function (e) {
var o = $('#dvKB input[kc=' + e.keyCode + ']');
if (o.length) {
o.addClass('focus');
setTimeout(function () {o.removeClass('focus') }, 100);
}
})
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。