window事件是较为重要的事件,接下来就讲解一下。

1.获取页面滚动栏的距离

  什么是滚动栏,就是网页内容过多时,通过滚轮控制上下显示或者左右显示;

  为窗口添加滚动条事件:
  window.onscroll=function(){};
  注意在获取滚动条距离的时候
  谷歌不识别document.documentElement.scrollTop,必须要加上document.body.scrollTop;即
  var scrolltop=document.documentElement.scrollTop||document.body.scrollTop;
  这样才能兼容各个浏览器。
  这个事件一般用作当页面滚动到某个距离时才出发某个事件的情况,
  比如京东的导航条:

以及滑到底部的时候出发一个回到顶部的事件

几种打开新超链接的方式:

1.替换当前窗口,可后退

  html写法:<a href="http://www.baidu.com" target="_self">

  效果:  

  JS写法:<a href="javascript:open('http://www.baidu.com','_self')">替换当前窗口,可后退</a>

  效果:  

2.替换当前窗口不可后退

  html无法做到;

  JS写法:<a href="javascript:location.replace('http://www.baidu.com')">替换当前窗口,不可后退</a>

  效果:

3.在新窗口打开,可以打开多个

  html写法:<a href="http://www.baidu.com" target="_blank">在新窗口打开,可以打开多个</a>

  效果:

  

  JS写法:<a href="javascript:open('http://www.baidu.com','_blank')">在新窗口打开,可以打开多个</a>

  效果:

4.在新窗口打开,只能打开一个

  html写法:<a href="http://www.bailiban.com" target="bailiban">新窗口打开,只能打开一个</a>

  效果:

  JS写法:<a href="javascript:open('http://www.bailiban.com','k')" >新窗口打开,只能打开一个</a>

  效果:

注意:

  打开窗口语法:
           var newWindow = window.open(url,name,网页信息)
           name页面的名称,不能省略
          window.close() 注意有些浏览器不允许关闭自身
          设计好的一些name属性:
               _self 自动获取当前窗口的name
              _blank 不让浏览器的name为空

  上述中只打开一个页面的操作就是name值带来的,类似于给前面的网址取了一个名字,通过name值来打开网页

    

window事件的更多相关文章

  1. JavaScript 获取按键,并屏蔽系统 Window 事件

    // JavaScript 获取按键,并屏蔽系统 Window 事件 window.document.onkeydown = onkeydown; function onkeydown(event) ...

  2. angular 使用window事件

    1. 使用host   2. 使用HostListener 推荐使用第二种方式. 不推荐下面的方法,虽然也能进行window事件的绑定,但组件销毁后,window事件任然保留,即使手动在组件的ngOn ...

  3. (非妙味3):浏览器window事件:及浏览各种尺寸介绍

    (触发)window.onload;  window.onscroll;   window.onresize; (兼容)网页可视区尺寸.网页全文尺寸.滚动距离 (实例)广告块高度动态居中.回到顶部   ...

  4. 加载window事件

    $(document).ready()和window.onload的区别 发表于 2012-08-29 由 admin 以浏览器装载文档为例,在页面加载完毕后,浏览器会通过JavaScript为DOM ...

  5. WPF中常用的Window事件

    官方链接:https://msdn.microsoft.com/en-us/library/system.windows.window.statechanged(v=vs.110).aspx 1. A ...

  6. angular4 使用window事件

    Angular使用window对象中的事件最好不要像使用jQuery那样使用 如下: 注:写事件直接绑定到window对象上了,组件销毁时这个事件没有解绑 可以使用剪头函数不用声明that 注:这样写 ...

  7. jquery自定义window事件

    <body> <a href='https://www.baidu.com/'>百度</a> </body> <script type=" ...

  8. window对象,BOM,window事件,延时器,DOM

    01.定时器补充 function fn(){    console.log(1);}setInterval("fn()",100);  //定时器调用匿名函数/*   funct ...

  9. js window事件解析(转载)

    js-window对象的方法和属性资料 hxpd 发表于 2007-05-08 21:58:18 熟练window对象的open.close.alert.confirm.prompt.setTimeo ...

随机推荐

  1. flutter State管理

    import 'package:flutter/material.dart'; import 'package:scoped_model/scoped_model.dart'; class State ...

  2. Android 打开相册拍照选择多张图片显示

    添加依赖: compile 'me.iwf.photopicker:PhotoPicker:0.1.8' compile 'com.jaeger.ninegridimageview:library:1 ...

  3. openresty开发系列27--openresty中封装redis操作

    openresty开发系列27--openresty中封装redis操作 在关于web+lua+openresty开发中,项目中会大量操作redis, 重复创建连接-->数据操作-->关闭 ...

  4. python初级 0 出发吧

    一.与Python交互 键入命令(指令)后,Python立即执行这个命令 1 进入notebook交互编程环境 进入notebook环境, 点击New菜单下的Python 3环境进入到交互编程环境 2 ...

  5. 利用cglib给javabean动态添加属性,不用在建VO

    有的时候 比如你用的是hibernate或者Spring jdbc 来做dao层进行数据库相关的操作的时候,若果是单表的操作的时候 还比较简单 hibernate可直接返回(get,load)你的需要 ...

  6. 解决no module named setuptools

    To install setuptools on Debian: sudo apt-get install python-setuptools For Python 3.x: sudo apt-get ...

  7. keepalived通过飘移ip实现高可用配置步骤

    环境:两台虚拟机即可 centos7.3虚拟机A 10.0.3.46 centos7.3虚拟机B 10.0.3.110 对外开放的虚拟ip 10.0.3.96(这个ip只需要在keepalived里面 ...

  8. C#中 IEnumerable, ICollection, IList, List的使用

    List是類,實現了IList接口,IList繼承了ICollection,ICollection繼承了IEnumerable,IEnumerable是其中最底層的接口. 實現IEnumerable接 ...

  9. Django学习过程中遇到的问题

    一.Django数据同步过程中遇到的问题: 1.raise ImproperlyConfigured('mysqlclient 1.3.13 or newer is required; you hav ...

  10. zend framework多模块多Layout配置

    转自: http://blog.csdn.net/a82168506/article/details/10228011 上次接触zend framework已经很久远了,10年的事情了.最近在做一个项 ...