web页面位置详解

原创 2016年05月31日 10:06:33

1理解客户区坐标位置

 

  含义是:鼠标指针在可视区中的水平clientX和垂直clientY坐标;

  如下图所示:

  

2理解页面坐标位置pageX和pageY:

 

  pageX与pageY是指页面坐标的位置,与clientX和clientY的区别是:它包含页面滚动条的位置,如下图所示:

  

但是IE8及更早的版本不支持pageX与pageY

EventUtil.addHandler(btn,'click',function(e){ e = EventUtil.getEvent(e); var pageX = e.pageX, pageY = e.pageY; if(!pageX) { pageX = e.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft); } if(!pageY) { pageY = e.clientY + (document.body.scrollTop || document.documentElement.scrollTop); } console.log("页面X轴坐标为:"+pageX + " "+ "页面Y轴坐标为:"+pageY); });

 3理解屏幕坐标的位置

  屏幕横坐标screenX和垂直坐标screenY属性是相对于整个屏幕的。如下图所示:

JavaScript在Web页面中的位置

用JavaScript编写的代码需要放在HTML文档中才能被浏览器执行,有两种方式可以做到这一点。 一.直接内嵌JavaScript代码         这种方法将JavaScript代码写在  ...
  • huiting_liu
  • huiting_liu
  • 2016年12月09日 15:51
  • 92

Spark UI界面原理

本文以Spark-1.6.0源码为基础,分析了Spark UI界面的框架构成,及页面数据展示方法。...
  • dabokele
  • dabokele
  • 2016年07月06日 23:21
  • 12331

java、JSP web项目中的路径问题

java web项目中的路径,有相对路径和绝对路径 什么是相对路径呢    举个简单例子 我们有项目   test     发布后地址  http://localhost:8080/test/ 页面 ...
  • qiyejunlintian
  • qiyejunlintian
  • 2015年01月26日 11:38
  • 1894

移动端web开发之坑--自适应布局下的返回页面位置定位问题

话说这应该是移动开发小伙伴们经常用的一段代码,1rem=100px;兼容性也很好;然而产生这次问题的重点是doc.addEventListener('DOMContentLoaded', recalc...
  • screaming_color
  • screaming_color
  • 2017年01月04日 22:20
  • 544

Java Web开发之详解JSP

JSP作为Java Web开发中比较重要的技术,一般当作视图(View)的技术所使用,即用来展现页面。而Servlet由于其本身不适合作为表现层技术,所以一般被当作控制器(Controller)所使用...
  • guwei4037
  • guwei4037
  • 2014年10月07日 20:39
  • 19835

路由器web界面分析(二)---web和底层如何交互

在工作中涉及到了web页面和底层交互问题,这里做下简单回顾。本文基于hisi方案分析web界面、服务器boa、配置管理模块cm之间的调用逻辑。 浏览器和服务器模型基本的流程是:浏览器向服务器发送请求...
  • u014530704
  • u014530704
  • 2017年06月03日 15:22
  • 865

web打印网页指定区域

打印网页指定区域,整体思路就是讲要打印的东西通过class单独标记起来,然后打印的时候根据class获取要打印的内容,直接打印。把要打印的内容放入一个 span或div,然后通过一个函数打印。把要打印...
  • ljinddlj
  • ljinddlj
  • 2016年11月10日 00:15
  • 634

springboot 简单web简单搭建和jsp界面

1.首先创建Mavne项目。 第二步骤: 添加修改pom.xml
  • wk2197727
  • wk2197727
  • 2017年01月17日 11:33
  • 13822

js获取页面元素的位置

一、网页的大小和浏览器窗口的大小 首先,要明确两个基本概念。 一张网页的全部面积,就是它的大小。通常情况下,网页的大小由内容和CSS样式表决定。 浏览器窗口的大小,则是指在浏览器窗口中看到的那部...
  • Inuyasha1121
  • Inuyasha1121
  • 2015年10月15日 10:11
  • 2132

NGINX高性能Web服务器详解(读书笔记)

第4章  Nginx服务器的高级配置 4.1 针对IPv4的内核7个参数的配置优化 说明:我们可以将这些内核参数的值追加到Linux系统的/etc/sysctl.conf文件中,然后使用如...
  • foreverfriends
  • foreverfriends
  • 2017年04月18日 14:09
  • 537
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:web页面位置详解
举报原因:
原因补充:

(最多只允许输入30个字)