|
|
Publicado en 3/7/2018 16:54:42
|
|
|
Javascrip{filter}t obtiene el tamaño de la pantalla, la ventana del navegador, el navegador y la altura y ancho de la página web
Área de visibilidad de la página web: document.body.clientWidth
Área de visibilidad de la página web: document.body.clientAltura
Ancho de área visible de página web: document.body.offsetWidth (incluyendo el ancho del borde)
Área visible de la página web altura: document.body.offsetAltura (incluyendo el ancho del borde)
El ancho completo del texto del cuerpo de la página web: document.body.scrollWidth
El texto completo de la página web es alto: document.body.scrollHeight
La página está desplazada en lo alto: document.body.scrollTop
La página está desplazada hacia la izquierda: document.body.scrollLeft
En el cuerpo de la página web: window.screenTop
El cuerpo de la página web está a la izquierda: window.screenLeft
Alta resolución de pantalla: window.screen.height
Ancho de resolución de pantalla: window.screen.width
Pantalla disponible altura del espacio de trabajo: window.screen.availHeight
Ancho de espacio de trabajo disponible de pantalla: window.screen.availWidth
jQuery obtiene varios anchos y alturas
Área de visualización del navegador
$(ventana).altura()
$(ventana).ancho()
El tamaño del documento de la página
$(documento).altura()
$(documento).ancho()
El tamaño del cuerpo actual del documento de ventana
$(document.body).altura()
$(document.body).width()
La altura vertical de la barra de desplazamiento hasta la parte superior (es decir, la altura a la que se enrolla la página)
$(document).scrollTop()
$(document).scrollLeft()
Segmentación precisa de HTML: scrollLeft, scrollWidth, clientWidth, offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX respecto a las coordenadas horizontales del documento
event.clientY respecto a las coordenadas verticales del documento
event.offsetX respecto a las coordenadas horizontales del contenedor
event.offsetY respecto a las coordenadas verticales del contenedor
document.documentElement.scroll. Valor superior para desplazamiento vertical
event.clientX+document.documentElement.scrollTop La cantidad de coordenadas horizontales + desplazamiento vertical respecto al documento
Es decir, las diferencias entre Firefox son las siguientes:
IE6.0、FF1.06+:
clienteWidth = ancho + relleno
clientHeight = altura + relleno
offsetWidth = ancho + relleno + borde
desplazamientoAltura = altura + relleno + borde
IE5.0/5.5:
clienteWidth = ancho - borde
clientHeight = altura - borde
offsetWidth = ancho
DesplazamientoAltura = altura
(Cabe mencionar: el atributo margin en CSS no tiene nada que ver con clienteWidth, offsetWidth, clientHeight, offsetHeight)
Área de visibilidad de la página web: document.body.clientWidth
Área de visibilidad de la página web altura: document.body.clientAltura
Ancho de área visible de página web: document.body.offsetWidth (incluyendo el ancho del borde)
Altura del área visible web: document.body.offsetAltura (incluyendo la altura de los bordes)
El ancho completo del texto de la página web: document.body.scrollWidth
Texto completo altura: document.body.scrollHeight
La página está desplazada en lo alto: document.body.scrollTop
La página está desplazada hacia la izquierda: document.body.scrollLeft
En el cuerpo de la página web: window.screenTop
Izquierda del cuerpo de la página web: window.screenLeft
Alta resolución de pantalla: window.screen.height
Ancho de resolución de pantalla: window.screen.width
Pantalla disponible altura del espacio de trabajo: window.screen.availHeight
Ancho de espacio de trabajo disponible de pantalla: window.screen.availWidth
div.style.top: La distancia superior relativa al componente donde se encuentra la div
－－－－－－－－－－－－－－－－－－－
Aspectos técnicos destacados
El código de esta sección utiliza principalmente algunas propiedades del objeto Documento sobre la ventana, y las funciones principales y el uso de estas propiedades son los siguientes.
Para obtener el tamaño de una ventana, se deben usar diferentes propiedades y métodos para distintos navegadores: para detectar el tamaño real de una ventana, hay que usar la propiedad de Ventana en Netscape; En IE, tienes que profundizar en el documento para detectar el cuerpo. En el entorno DOM, para obtener el tamaño de la ventana, hay que prestar atención al tamaño del elemento raíz, no al elemento.
La propiedad innerWidth del objeto Ventana contiene el ancho interno de la ventana actual. La propiedad innerHeight del objeto Ventana contiene la altura interna de la ventana actual.
El atributo cuerpo del objeto Documento corresponde a la etiqueta del documento HTML. La propiedad documentElement del objeto Document representa el nodo raíz del documento HTML.
document.body.clientHeight indica la altura actual de la ventana en la que se encuentra el documento HTML. document.body. clienteWidth representa el ancho actual de la ventana en la que se encuentra el documento HTML.
Eventos de tamaño del navegador
window.onresize=funName; Llama a la función funName cuando el tamaño del navegador cambie |
Anterior:SEO Título Descripción de palabras clave Límite de palabras Título, palabras clave, descrip{filter}tion longitudPróximo:El tipo "Objeto" se define en un ensamblador sin referencia. Debe añadir una respuesta al programa...
|
