您的位置：寻梦网首页＞编程乐园＞CSS 初步＞CSS特效赏析
CSS特效赏析

CSS特效赏析
　1.动态改变样式
　2.动态可视化效果
　3.动态滤镜显示
　4.Blentrans属性
　5.Revealtrans属性
　6.动态Glow属性
　7.显示和隐藏
　8.兼容两种浏览器
　9.移动对象
　10.对象的滑动
　11.键盘控制对象
　12.鼠标控制对象
　13.Clip属性的应用
　14.动态文字变换
　15.动态改变页面样式
　16.动态时钟控制
　17.倒计时
　18.动态刷新


CSS特效赏析

　上一实例　下一实例   

11、键盘控制对象

本节我们将讲一下键盘控制对象移动的例子。
　　在前面讲过的使对象移动的例子，如果能用键盘来控制，将会大大加强您和电脑之
间的交互性。那么键盘控制怎么实现呢？
　　这需要涉及到事件问题。也就是说需要有一个键盘控制事件来激发键盘按下和松开的状态。这里用到的是“keydown”事件，这个事件的书写格式是这样的：

document.onkeydow=keydown

上面语句中的keydown是一个子程序，也就是说当您的浏览器读到这个子程序时，它就会知道您按下了哪一个键，从而作出相应的反应。我们下面来看一个例子：

　　

　　请按任意键

　　当您按下任意键时，弹出了一个窗口，告诉您按下的是哪一个键，并且告诉您该键的内码是多少。实现这种键盘控制的代码如下：

　　<html>
　　<head>
　　<script language="javascript">
　　<!--
　　function keyDown() {
　　var keycode = event.keyCode
　　var realkey = String.fromCharCode(event.keyCode)
　　alert("keycode: " + keycode + "\nrealkey: " + realkey) }
　　document.onkeydown = keyDown
　　 //--> </script>
　　//*子程序*//</head>
　　<body>
　　<p class="p2">请按任意键</p> </body>
　　</html>

　　上面的这个例子很简单是一个很简单的例子，链接，在这里您可以看到键盘控制图片移动的例子，链接 您可以看到另外一种形式的移动。

　　好了，本节就讲到这里，下一节将向您介绍鼠标点击控制的例子。

　上一实例　下一实例