公司的界面设计环节总算是告一段落了,必需要承认的是,这段时间晚间的学习带给我非常多益处。在工作中偶尔的应用,效果出奇的好,收到领导和同事的一些小赞扬,表示非常欣慰,也长了点不少自信,尽管不理解,他们这些工作好几年的人应该对这些不是应该都非常了解么。为什么会表现出来有些陌生。只是不想那么多了。喜欢就好。

今天来记录下js实现双击后网页自己主动跑,这个在非常多站点上都有所体现吧,那么该怎样实现呢?

首先我们来分析下实现的基本原理:

1、获取鼠标的双击事件(这个在前面以前记录过一次,可是非常不幸的是上次貌似还写错了,这里纠正下ondblclick。在javascript中的大写和小写真的是要注意);

2、网页自己主动跑,也就是说页面滚动效果,实际上就是scrollTop不断增大。直到达究竟部为止。

再用代码来实现下:

var nowPostion,timer;
document.onmousedown=stop;
document.ondblclick=windowScroll;//记得哦,是ondbclick。所有是小写
function windowScroll() {//var windowScroll=function(){} ,还记得这个写法么
timer=setInterval("scrollwindow()",1);
}
function stop(){
clearInterval(timer);
}
function scrollwindow() {//这是实现的关键
nowPostion=document.body.scrollTop;//当前滚动栏的上端距离
window.scroll(0,++nowPostion);//这里是++nowPostion,不是nowPostion++哦
if (nowPostion != document.body.scrollTop) //这就是++在前的目的
stop();
}

记录几个关键点:

1、双击事件。ondbclick事件,再来声明下;

2、window.scroll(1,100);跟这个写法非常类似吧,那么它到底是什么意思呢?

事实上这个我们首先要知道參数的真正意义就好了。參数能够说是一个坐标。代表了以左上角为原点,该点据页面顶端的距离和最左端的距离,然后再来理解这个事件是不是就easy多了,以像素为单位。从左上角点到指定点的移动。

3,、自增。先++还是后++,先++代表先进行+1,再进行操作;后++则是先进行数据运算,然后再+1;

温故而知新,非常美..

js实现双击后网页自己主动跑-------Day55的更多相关文章

  1. Meta标签实现阻止移动设备(手机、Pad)的浏览器双击放大网页

    一.背景 在当今这个移动设备发展越来越快,并且技术越来越成熟的时代,移动设备成了企业扩展业务不可或缺的重要领域之一,随之而来的是适应手机的网站层出不穷,在开发过程中,我们往往会遇到一个很尴尬的问题:移 ...

  2. JS实现双击编辑可修改

    需求描述:在一段文字处双击可以进行修改,也就是双击后创建输入框,输入内容,在输入框失去焦点后将输入的内容再以文字的形式显示出来,以下是html代码: 1 <fieldset> 2 < ...

  3. 在Js或者cess后加版本号 防止浏览器缓存

    在Js或者cess后加版本号 防止浏览器缓存 客户端浏览器会缓存css或js文件,从而减少加载次数,减少流量,提高网页的访问速度.为了使得每次修改js或者css能生效,可以通过改变版本号来使得客户端浏 ...

  4. C#在WinForm中使用WebKit传递js对象实现与网页交互的方法

    这篇文章主要介绍了C#在WinForm中使用WebKit传递js对象实现与网页交互的方法,涉及针对WebBroswer控件及WebKit控件的相关使用技巧,需要的朋友可以参考下 本文实例讲述了C#在W ...

  5. 浅谈网络爬虫爬js动态加载网页(一)

    由于别的项目组在做舆情的预言项目,我手头正好没有什么项目,突然心血来潮想研究一下爬虫.分析的简单原型.网上查查这方面的资料还真是多,眼睛都看花了.搜了搜对于我这种新手来说,想做一个简单的爬虫程序,所以 ...

  6. Eclipse中js文件修改后浏览器不能及时更新的解决办法

    项目中js文件修改后浏览器不能及时更新的解决办法 转载:http://www.codeweblog.com/%E9%A1%B9%E7%9B%AE%E4%B8%ADjs%E6%96%87%E4%BB%B ...

  7. 为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件

    为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件.样式文件命名格式如:forms[_屏幕宽度].css,样式文件中只需重新定义文本框和下拉框的宽度即可. 在包含的头文件 ...

  8. [JS]jQuery,javascript获得网页的高度和宽度

    [JS]jQuery,javascript获得网页的高度和宽度网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeigh ...

  9. 实现DevExpress GridControl 只有鼠标双击后才进行修改数据

    1. 实现DevExpress GridControl 只有鼠标双击后才进行修改数据:修改GridView.OptionsBehavior.EditorShowMode属性为Click 2. 实现De ...

随机推荐

  1. live555 for Android

    因为Live555 包中未提供Android 的config 所以编译器来比較麻烦,须要自己编写Android.mk ,下面是我通过 改动 现有的config文件,在cygwin实现 编译的过程,co ...

  2. Android使用百度定位SDK方法及错误处理

    下面事例是使用Android平台的部分代码.对于这个平台百度的开放人员已经写了完整的demo,把工程导入到eclipse中之后一般没有错误,如果报错的话,eclipse也会给出提示.一般可以通过将pr ...

  3. 自己写shell命令pwd

    思维:(1)得到"."的i节点号,叫n(使用stat) (2)chdir ..(使用chdir) (3)找到inode号为n的节点,得到其文件名称. 反复上述操作直到当前文件夹&q ...

  4. Cocostudio学习笔记(4) LoadingBar+ TextField

    这同时录制两个控件的使用方法:LoadingBar和 TextField. -------------------------------------------------------------- ...

  5. ViewPager空指针错误,android.support.v4.view.ViewPager.onSaveInstanceState

    support.v4 包为我们提供了一个非常实用的滑动控件ViewPager,在使用ViewPager时有一个需要注意的地方: 即: android.support.v4.view.ViewPager ...

  6. 【Android进阶】让程序运行效率更高的编程技巧总结

    1.在程序中若出现字符串连接的情况,请使用StringBuffer代替String,这样可以减少多次创建String以及垃圾回收所带来的内存消耗 2.尽量使用局部变量.调用方法时传递的参数以及调用中创 ...

  7. 重新想象 Windows 8 Store Apps (32) - 加密解密: 非对称算法, 数据转换的辅助类

    原文:重新想象 Windows 8 Store Apps (32) - 加密解密: 非对称算法, 数据转换的辅助类 [源码下载] 重新想象 Windows 8 Store Apps (32) - 加密 ...

  8. JQuery操作select checkbox radio总结

    JQuery是一个非常强大的工具,所以我必须找到它最方便的方法,嘻嘻 Select CRUD: Select搜: 1.val值: $("#selectid").val();     ...

  9. socket计划编制的原则

    socket编程原理 1.问题的引入 1) 普通的I/O操作过程: UNIX系统的I/O命令集,是从Maltics和早期系统中的命令演变出来的,其模式为打开一读/写一关闭(open-write-rea ...

  10. 离PACKET_INp获取信息acket data

         于Floodlight模块假设要packet in消息,就对对应的消息类型进行监听就可以.然后在receive方法中就能够操纵这个上传上来的packet_in.      关键代码:   E ...