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-运动基础（一）续的更多相关文章

  1. 第八节 JS运动基础

    运动基础 让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快 匀速运动(速度不变) 运动框架及应用: 运动框架: 在 ...

  2. 学习blus老师js(6)--js运动基础

    运动基础 一.匀速运动 运动框架 在开始运动时,关闭已有定时器 把运动和停止隔开(if/else) <!DOCTYPE HTML> <html> <head> &l ...

  3. JS运动基础(一)

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  4. js运动基础2（运动的封装）

    简单运动的封装 先从最简单的封装开始,慢慢的使其更丰富,更实用. 还是上一篇博文的代码,在此不作细说. 需求:点击按钮,让元素匀速运动. <!DOCTYPE html> <html ...

  5. JS运动基础(四) 碰撞运动

    碰撞运动撞到目标点,速度反转无重力的漂浮Div速度反转滚动条闪烁的问题过界后直接拉回来 加入重力反转速度的同时,减小速度纵向碰撞,横向速度也减小横向速度小数问题(负数) <!DOCTYPE HT ...

  6. JS运动基础(三) 弹性运动

    加减速运动速度不断增加或减少速度减小到负值,会向反方向运动 弹性运动在目标点左边,加速:在目标点右边,减速根据距离,计算加速度 带摩擦力的弹性运动弹性运动+摩擦力 弹性:速度 += (目标点 - 当前 ...

  7. JS运动基础(二) 摩擦运动、缓冲运动

    摩擦运动: 逐渐变慢,最后停止 缓冲运动: 与摩擦力的区别:可以精确的停到指定目标点距离越远速度越大速度由距离决定速度=(目标值-当前值)/缩放系数Bug:速度取整值取整: iSpeed = iSpe ...

  8. JS运动基础

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  9. Javascript 运动基础 01

    JS运动基础  运动基础   让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快   匀速运动 速度不变 <s ...

  10. JS学习-基础运动

    多物体运动 多个物体用同一个函数时,函数里定义的定时器应该要每个物体对应一个定时器名称,不然会导致未完成运动就被关闭了,因为定时器名称一样,而开启定时器前会清除一下. obj.timer 多值同时运动 ...

随机推荐

  1. chapter 12_2 保存无环的table

    保存table有几种方法,选用哪种方法取决于对table的结构作出了哪些限制性的假设 第一个方法: function serialize(o) if type(o) == "number&q ...

  2. mysql的存储引擎如何选择

    myisam:如果表对事务要求不高,用时以查询和添加为主,我们考虑myisam存储,如bbs中的发帖表.回复表 innodb:对事务要求高,保存的数据都是重要的数据,我们建议使用innodb,比如订单 ...

  3. 关于oracle数据库（8）查询2

    筛选数据,直接加where条件,并且and,或者or 使用rownum获取前N条数据 select * from 表名 where rownum <= 数字; 如:获取前5条数据 select ...

  4. Asp.Net MVC 在后台获取PartialView、View文件生成的字符串

    在Asp.net MVC的实际开发中,有时需要在后台代码中获取某个View 或者 PartialView 生成的字符串,示例如下: 1. 将View文件输出为字符串: /// <summary& ...

  5. li浮动时ul高度为0，解决ul自适应高度的几种方法

    网址:http://www.gxchina.com/edu/11208.html 1.给ul元素设置高度height最直接的办法是给ul元素设置一个高度,即ul标签添加height属性,代码如下: u ...

  6. JPA 系列教程19-jpa-uuid主键生成策略

    ddl语句 CREATE TABLE `t_user` ( `id` varchar(32) NOT NULL, `name` varchar(255) DEFAULT NULL, PRIMARY K ...

  7. js解析php返回的json数据无法获取length的问题分析

    1.问题出现的过程,js解析php json_encode 的数据,无法获取长度信息,提示undefined   debug:       首先打印查看了php encode后的数据,返现最外层是一个 ...

  8. oracle 同义词

    同义词概念 Oracle的同义词(synonyms)从字面上理解就是别名的意思,和视图的功能类似,就是一种映射关系.它可以节省大量的数据库空间,对不同用户的操作同一张表没有多少差别;它扩展了数据库的使 ...

  9. 利用朴素贝叶斯算法进行分类-Java代码实现

    http://www.crocro.cn/post/286.html 利用朴素贝叶斯算法进行分类-Java代码实现  鳄鱼  3个月前 (12-14)  分类:机器学习  阅读(44)  评论(0) ...

  10. git(创建,提交,回退)

    创建版本库 2334次阅读 什么是版本库呢?版本库又名仓库,英文名repository,你可以简单理解成一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改.删除,Git都能跟踪,以 ...