在不损失质量的情况下裁剪和调整一组图像的大小答案

【问题标题】：Crop and resize a group of images without losing quality在不损失质量的情况下裁剪和调整一组图像的大小
【发布时间】：2019-11-30 10:43:05
【问题描述】：

我有以下示例情况：

https://imgur.com/GAGqQ2p

（图片内有3个球）

使用 jquery jquery 或 css，我想切割黄色球，然后改变它的大小（宽度和高度）。等等我想要的球

我在帖子中看到了一个方法：Programmatically Clip/Cut image using Javascript。但是我正在失去图像质量并且无法更改高度或宽度

这是我的代码：

function setViewport(img, x, y, width, height) {
    if (!img) {
        return;
    }

    img.style.left = "-" + x + "px";
    img.style.top = "-" + y + "px";

    if (width !== undefined) {
        img.parentNode.style.width = width + "px";
        img.parentNode.style.height = height + "px";
    }
}

【问题讨论】：

标签： javascript jquery css

【解决方案1】：

从它的声音来看，您想要操纵image sprite，它允许您选择和交换单个图像的片段。您可以编写自己的代码，但有像 jquery-sprite 这样的插件可以简化 jQuery 中的精灵管理。但是，使用CSS sprites 可以获得更好的性能。

【讨论】：