javascript每日一练(六)——事件一
一、event对象
var oEvent = ev || event;//获取事件对象 oEvent.clientX oEvent.clientY//获取鼠标坐标 oEvent.cancelBubble = true;//阻止冒泡
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#div1{ width:100px; height:100px; background:red; display:none; position:absolute;}
</style>
<script>
window.onload = function(){
var oBtn = document.getElementById('btn1');
var oDiv = document.getElementById('div1');
//event对象,用来获取事件的详细信息
//获取鼠标位置
document.onmousemove = function(ev){
var oEvent = ev || event;
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
oDiv.style.top = oEvent.clientY + scrollTop + 'px';
oDiv.style.left = oEvent.clientX + 'px';
};
oBtn.onclick = function(ev){
var oEvent = ev || event;
oDiv.style.display = 'block';
oEvent.cancelBubble = true;
};
document.onclick = function(){
oDiv.style.display = 'none';
};
};
</script>
</head>
<body style="height:2000px;">
<input id="btn1" type="button" value="显示" />
<div id="div1">
<a href="http://baidu.com">百度</a>
</div>
</body>
</html>
javascript每日一练(六)——事件一的更多相关文章
- javascript每日一练(七)——事件二:键盘事件
一.键盘事件 onkeydown触发, keyCode键盘编码 ctrlKey altKey shiftKey 键盘控制div移动 <!doctype html> <html> ...
- javascript每日一练(八)——事件三:默认行为
一.阻止默认行为 return false; 自定义右键菜单 <!doctype html> <html> <head> <meta charset=&quo ...
- javascript每日一练(一)——javascript基础
一.javascript的组成 ECMAScript DOM BOM 二.变量类型 常见类型有:number, string, boolean, undefined, object, function ...
- javascript每日一练—运动
1.弹性运动 运动原理:加速运动+减速运动+摩擦运动: <!doctype html> <html> <head> <meta charset="u ...
- javascript每日一练(十四)——弹性运动
一.弹性运动 运动原理:加速运动+减速运动+摩擦运动: <!doctype html> <html> <head> <meta charset="u ...
- javascript每日一练(十三)——运动实例
一.图片放大缩小 <!doctype html> <html> <head> <meta charset="utf-8"> < ...
- javascript每日一练(十二)——运动框架
运动框架 可以实现多物体任意值运动 例子: <!doctype html> <html> <head> <meta charset="utf-8&q ...
- javascript每日一练(十一)——多物体运动
一.多物体运动 需要注意:每个运动物体的定时器作为物体的属性独立出来互不影响,属性与运动对象绑定,不能公用: 例子1: <!doctype html> <html> <h ...
- javascript每日一练(十)——运动二:缓冲运动
一.缓冲运动 实现原理:(目标距离-当前距离) / 基数 = 速度(运动距离越大速度越小,运动距离和速度成反比) (500 - oDiv.offsetLeft) / 7 = iSpeed; 需要注意: ...
随机推荐
- 如何在自己的Activity中去控制EditText的焦点
在进入一个Activity时,如果这个Activity中有EditText,则这个EditText会自动获取焦点,然后就会弹出软键盘,这样给用户体验不是很好.所以一般会通过代码控制让EditText不 ...
- gridview的高级使用
后台数据 using System; using System.Collections.Generic; using System.Linq; using System.Web; using Sy ...
- Aop编程--注解与xml的实现
一.注解方式 1.首先引入spring对于aop编程的jar支持包,spring框架没有的包请自行在网上下载. aopalliance-alpha1.jar aspectjrt.jar aspectj ...
- 【转】 利用spring的profile切换不同的环境
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
- String to Integer (atoi) - 复杂的测试
这个题..是要把字符串转为整数.注意是整数,我看到整数的时候松了一口气,没有小数点的判断应该更好做.而且基本的转化函数我想每个程序员都无法忘记: res=res*+(str[i]-'); 其实就是这么 ...
- Week 5a - Mouse input and more lists ----mouse input
<span style="font-size:14px;">import simplegui import math # global variables ball_p ...
- jQuery源码,匿名函数自执行
jQuery框架的首尾是这样写的()(), (function(window){//这个window是个入参,随便起个名字都行 //这里面全都是js代码 })(window)//这个括号里的windo ...
- VCC、VDD、VEE、VSS的区别
电路设计以及PCB制作中,经常碰见电源符号:VCC. VDD.VEE.VSS,他们具有什么样的关系那? 一.解释 VCC:C=circuit 表示电路的意思, 即接入电路的电压 VDD:D=devic ...
- 英文:known good board ( KGB) / 中文:测试用标准板,黄金板
作为标准部件提供的.完全符合设计电气性能的在制板,可以作为与其它印制板比较的标准.
- codeblocks + MinGW 以及vc 使用预编译头文件的方法
MinGW编译器: 1.打开工程文件,在工程文件浏览其中,在你要设置为预编译的头文件上,点击鼠标右键,选择“属性(properties)” 你会看到一个多页面的属性框,选择“构建(build)”页面 ...