aidlab/Code-Create
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

111

Browse Source
This commit is contained in:
李志鹏
2026-05-20 15:54:42 +08:00
parent 8cf3a2177c
commit 28cb492aca
9 changed files with 294 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/directives/custom-animation.js
View File

@@ -204,18 +204,18 @@ function setDocumentStyles(parent, el, p = 0) {
`opacity ${oDuration} ${oDelay} ${oEasing}`,
]
el.style.transition = transitionArr.join(', ')
const tX = getCurrentValue(el, T.translateX_s, T.translateX, p)
const tY = getCurrentValue(el, T.translateY_s, T.translateY, p)
const sx = getCurrentValue(el, T.scaleX_s, T.scaleX, p, T.scale_s, T.scale, 1)
const sy = getCurrentValue(el, T.scaleY_s, T.scaleY, p, T.scale_s, T.scale, 1)
const r = getCurrentValue(el, T.rotate_s, T.rotate, p)
const rx = getCurrentValue(el, T.rotateX_s, T.rotateX, p)
const ry = getCurrentValue(el, T.rotateY_s, T.rotateY, p)
const rz = getCurrentValue(el, T.rotateZ_s, T.rotateZ, p)
const transform = `translate(${tX}px, ${tY}px) scale(${sx}, ${sy}) rotate(${r}deg) rotateX(${rx}deg) rotateY(${ry}deg) rotateZ(${rz}deg)`
const { num: tX, unit: tXUnit } = getCurrentValue(el, T.translateX_s, T.translateX, p)
const { num: tY, unit: tYUnit } = getCurrentValue(el, T.translateY_s, T.translateY, p)
const { num: sx } = getCurrentValue(el, T.scaleX_s, T.scaleX, p, T.scale_s, T.scale, 1)
const { num: sy } = getCurrentValue(el, T.scaleY_s, T.scaleY, p, T.scale_s, T.scale, 1)
const { num: r } = getCurrentValue(el, T.rotate_s, T.rotate, p)
const { num: rx } = getCurrentValue(el, T.rotateX_s, T.rotateX, p)
const { num: ry } = getCurrentValue(el, T.rotateY_s, T.rotateY, p)
const { num: rz } = getCurrentValue(el, T.rotateZ_s, T.rotateZ, p)
const transform = `translate(${tX}${tXUnit || 'px'}, ${tY}${tYUnit || 'px'}) scale(${sx}, ${sy}) rotate(${r}deg) rotateX(${rx}deg) rotateY(${ry}deg) rotateZ(${rz}deg)`
el.style.transform = transform
if (hasAttr(el, [T.opacity_s, T.opacity])) {
el.style.opacity = getCurrentValue(el, T.opacity_s, T.opacity, p, T.opacity_s, T.opacity, 1)
el.style.opacity = getCurrentValue(el, T.opacity_s, T.opacity, p, T.opacity_s, T.opacity, 1).num
}
}
function getAttrs(el, attrs = {}) {
@@ -227,9 +227,16 @@ function getAttrs(el, attrs = {}) {
return obj
}
function getCurrentValue(el, start, end, progress, bStart, bEnd, defaultValue = 0) {
const startNum = hasAttr(el, start) ? Number(el.getAttribute(start)) : hasAttr(el, bStart) ? Number(el.getAttribute(bStart)) : defaultValue
const endNum = hasAttr(el, end) ? Number(el.getAttribute(end)) : hasAttr(el, bEnd) ? Number(el.getAttribute(bEnd)) : defaultValue
return startNum + (endNum - startNum) * progress
const startStr = hasAttr(el, start) ? el.getAttribute(start) : hasAttr(el, bStart) ? el.getAttribute(bStart) : String(defaultValue)
const endStr = hasAttr(el, end) ? el.getAttribute(end) : hasAttr(el, bEnd) ? el.getAttribute(bEnd) : String(defaultValue)
const startNum = parseInt(startStr)
const endNum = parseInt(endStr)
const starUnit = startStr.match(/(px|deg|%|rem|em|vh|vw|pt|pc|mm|cm|in)$/i)?.[1] || ''
const endUnit = endStr.match(/(px|deg|%|rem|em|vh|vw|pt|pc|mm|cm|in)$/i)?.[1] || ''
return {
num: startNum + (endNum - startNum) * progress,
unit: starUnit || endUnit
}
}
function hasAttr(el, attr) {
if (Array.isArray(attr)) {