You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ant-design-vue/components/vc-util/Dom/css.ts

115 lines
3.0 KiB

const PIXEL_PATTERN = /margin|padding|width|height|max|min|offset/;
const removePixel = {
left: true,
top: true,
};
const floatMap = {
cssFloat: 1,
styleFloat: 1,
float: 1,
};
function getComputedStyle(node: HTMLElement) {
return node.nodeType === 1 ? node.ownerDocument.defaultView.getComputedStyle(node, null) : {};
}
function getStyleValue(node: HTMLElement, type: string, value: string) {
type = type.toLowerCase();
if (value === 'auto') {
if (type === 'height') {
return node.offsetHeight;
}
if (type === 'width') {
return node.offsetWidth;
}
}
if (!(type in removePixel)) {
removePixel[type] = PIXEL_PATTERN.test(type);
}
return removePixel[type] ? parseFloat(value) || 0 : value;
}
export function get(node: HTMLElement, name: any) {
const length = arguments.length;
const style = getComputedStyle(node);
name = floatMap[name] ? ('cssFloat' in node.style ? 'cssFloat' : 'styleFloat') : name;
return length === 1 ? style : getStyleValue(node, name, style[name] || node.style[name]);
}
export function set(node: HTMLElement, name: any, value: string | number) {
const length = arguments.length;
name = floatMap[name] ? ('cssFloat' in node.style ? 'cssFloat' : 'styleFloat') : name;
if (length === 3) {
if (typeof value === 'number' && PIXEL_PATTERN.test(name)) {
value = `${value}px`;
}
node.style[name as string] = value; // Number
return value;
}
for (const x in name) {
if (name.hasOwnProperty(x)) {
set(node, x, name[x]);
}
}
return getComputedStyle(node);
}
export function getOuterWidth(el: HTMLElement) {
if (el === document.body) {
return document.documentElement.clientWidth;
}
return el.offsetWidth;
}
export function getOuterHeight(el: HTMLElement) {
if (el === document.body) {
return window.innerHeight || document.documentElement.clientHeight;
}
return el.offsetHeight;
}
export function getDocSize() {
const width = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth);
const height = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);
return {
width,
height,
};
}
export function getClientSize() {
const width = document.documentElement.clientWidth;
const height = window.innerHeight || document.documentElement.clientHeight;
return {
width,
height,
};
}
export function getScroll() {
return {
scrollLeft: Math.max(document.documentElement.scrollLeft, document.body.scrollLeft),
scrollTop: Math.max(document.documentElement.scrollTop, document.body.scrollTop),
};
}
export function getOffset(node: any) {
const box = node.getBoundingClientRect();
const docElem = document.documentElement;
return {
left:
box.left +
(window.scrollX || docElem.scrollLeft) -
(docElem.clientLeft || document.body.clientLeft || 0),
top:
box.top +
(window.scrollY || docElem.scrollTop) -
(docElem.clientTop || document.body.clientTop || 0),
};
}