windows/QuickLook
1
0
Fork 0
mirror of https://github.com/QL-Win/QuickLook.git synced 2025-09-20 16:34:55 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Beautify the background color of Svg Web2

Browse Source
This commit is contained in:
ema
2025-06-30 06:00:29 +08:00
parent 98dd96283d
commit 7ca7d2783e
4 changed files with 29 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
QuickLook.Plugin/QuickLook.Plugin.ImageViewer/Resources/svg2html.html
View File

@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="zh-CN">
<html>
<head>
<meta charset="UTF-8" />
<title>SVG Preview</title>
@@ -22,7 +22,6 @@
#svgWrapper {
transform-origin: center center;
transition: transform 0.05s ease-out;
cursor: grab;
}
</style>
</head>
@@ -30,7 +29,6 @@
<div id="svgContainer">
<div id="svgWrapper"></div>
</div>
<script src="svg2html.js"></script>
</body>
</html>

37
QuickLook.Plugin/QuickLook.Plugin.ImageViewer/Resources/svg2html.js
View File

@@ -6,19 +6,15 @@
wrapper.innerHTML = svgString;
let scale = 1;
let translate = { x: 0, y: 0 };
let isDragging = false;
let lastMouse = { x: 0, y: 0 };
function updateTransform() {
wrapper.style.transform = `translate(${translate.x}px, ${translate.y}px) scale(${scale})`;
wrapper.style.transform = `scale(${scale})`;
}
document.addEventListener("wheel", (e) => {
e.preventDefault();
const scaleFactor = 1.1;
const oldScale = scale;
if (e.deltaY < 0) {
scale *= scaleFactor;
@@ -26,39 +22,8 @@
scale /= scaleFactor;
}
const rect = wrapper.getBoundingClientRect();
const dx = e.clientX - rect.left - rect.width / 2;
const dy = e.clientY - rect.top - rect.height / 2;
translate.x -= dx * (1 - scale / oldScale);
translate.y -= dy * (1 - scale / oldScale);
updateTransform();
}, { passive: false });
wrapper.addEventListener("mousedown", (e) => {
isDragging = true;
lastMouse = { x: e.clientX, y: e.clientY };
wrapper.style.cursor = "grabbing";
});
document.addEventListener("mousemove", (e) => {
if (!isDragging) return;
const dx = e.clientX - lastMouse.x;
const dy = e.clientY - lastMouse.y;
translate.x += dx;
translate.y += dy;
lastMouse = { x: e.clientX, y: e.clientY };
updateTransform();
});
document.addEventListener("mouseup", () => {
isDragging = false;
wrapper.style.cursor = "grab";
});
updateTransform();
})();