JS-运动基础（一）续
2.淡入淡出的图片
用变量存储透明度
<title>无标题文档</title>
<style>
#div1{width:293px; height:220px; background:url('images/05.jpg');filter:alpha(opacity:30);opacity:0.3;}
</style>
<script>
window.onload=function ()
{
var oDiv=document.getElementById('div1');
oDiv.onmouseover=function ()
{
startMove(100);
}
oDiv.onmouseout=function ()
{
startMove(30);
}
}
var alpha=30;
var timer=null; function startMove(iTarget)
{
var oDiv=document.getElementById('div1'); clearInterval(timer);
timer=setInterval(function (){
var speed=0;
if(alpha<iTarget)
{
speed=10;
}
else
{
speed=-10;
} if(alpha==iTarget)
{
clearInterval(timer);
}
else
{
alpha+=speed; oDiv.style.filter='alpha(opacity:'+alpha+')';
oDiv.style.opacity=alpha/100;
}
},30);
}
</script>
</head> <body>
<div id="div1"></div>
</body>
DOM操作应用知识补充
表单事件
onsubmit 提交时发生
onreset 重置时发生
表单内容验证
阻止用户输入非法字符 阻止事件
输入时、失去焦点时验证 onkeyup 、onblur
提交时检查 onsubmit
*后台数据检查
JS-运动基础（一）续的更多相关文章
- 第八节 JS运动基础
运动基础 让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快 匀速运动(速度不变) 运动框架及应用: 运动框架: 在 ...
- 学习blus老师js(6)--js运动基础
运动基础 一.匀速运动 运动框架 在开始运动时,关闭已有定时器 把运动和停止隔开(if/else) <!DOCTYPE HTML> <html> <head> &l ...
- JS运动基础(一)
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- js运动基础2（运动的封装）
简单运动的封装 先从最简单的封装开始,慢慢的使其更丰富,更实用. 还是上一篇博文的代码,在此不作细说. 需求:点击按钮,让元素匀速运动. <!DOCTYPE html> <html ...
- JS运动基础(四) 碰撞运动
碰撞运动撞到目标点,速度反转无重力的漂浮Div速度反转滚动条闪烁的问题过界后直接拉回来 加入重力反转速度的同时,减小速度纵向碰撞,横向速度也减小横向速度小数问题(负数) <!DOCTYPE HT ...
- JS运动基础(三) 弹性运动
加减速运动速度不断增加或减少速度减小到负值,会向反方向运动 弹性运动在目标点左边,加速:在目标点右边,减速根据距离,计算加速度 带摩擦力的弹性运动弹性运动+摩擦力 弹性:速度 += (目标点 - 当前 ...
- JS运动基础(二) 摩擦运动、缓冲运动
摩擦运动: 逐渐变慢,最后停止 缓冲运动: 与摩擦力的区别:可以精确的停到指定目标点距离越远速度越大速度由距离决定速度=(目标值-当前值)/缩放系数Bug:速度取整值取整: iSpeed = iSpe ...
- JS运动基础
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Javascript 运动基础 01
JS运动基础 运动基础 让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快 匀速运动 速度不变 <s ...
- JS学习-基础运动
多物体运动 多个物体用同一个函数时,函数里定义的定时器应该要每个物体对应一个定时器名称,不然会导致未完成运动就被关闭了,因为定时器名称一样,而开启定时器前会清除一下. obj.timer 多值同时运动 ...
随机推荐
- Excel教程(9) - 信息函数
CELL 用途:返回某一引用区域的左上角单元格的格式.位置或 内容等信息,该函数主要用于保持与其它电子表格程序的兼容 性. 语法:CELL(info_type,reference) 参数:Info ...
- dell 去鼠标版功能widnows
桌面计算机(点击右键)----管理----设备管理器-----鼠标------选择触摸板(ps/2 兼容鼠标)---右击------跟新驱动-------浏览计算机查找------从计算机列表中选择- ...
- 复用TCP连接提升流媒体服务器之间流量转发效率
由于媒体推流客户端所在地域不同.所接入网络运营商不同.就近接入原则等因素,导致不同的视频推流客户端会推流至不同的流媒体服务器(本文主要针对目前WEB或手机的基于TCP的流媒体服务器),在某流媒体服务器 ...
- 远程桌面协议浅析（VNC/SPICE/RDP）
由于最近项目涉及到虚拟桌面,就花了点时间找了点资料看了一下,目前常用的协议有VNC/SPICE/RDP三种,就在这里做一个简单的介绍. 三种协议的对比 SPICE VNC RDP BIOS屏幕显示 能 ...
- PHP修改记录
1. Http请求错误--20151123 参考网址:http://www.lvtao.net/dev/php-nginx-uploadfiy.html 是配置问题,修改php.ini文件: uplo ...
- 线程中sleep方法和wait方法有什么区别？
如果你没有接触过java的多线程,那么多对于这两个方法可能有点陌生,看名字好像这两个方法是差不多的,但是实际上面差别好大. 首先我们看一下官方的API Sleep(sleep有两个方法,另一个方法传递 ...
- LeetCode OJ 101. Symmetric Tree
Given a binary tree, check whether it is a mirror of itself (ie, symmetric around its center). For e ...
- varnish缓存安装使用
varnish PDF http://files.cnblogs.com/jimingsong/varnish.pdf 目前介绍CentOS6.4-64位系统 yum安装varnish: 配置varn ...
- how to use tar?
In UNIX, tar is the most useful tool to compress files (just like zip in Windows.) To compress, inpu ...
- LVS负载均衡的三种模式和八种算法总结
三种LVS负载均衡模式 调度器的实现技术中,IP负载均衡技术是效率最高的,IP虚拟服务器软件(IPVS)是在linux内核中实现的｡ LVS负载均衡模式---1.NAT模式 NAT用法本来是因为网络I ...