получение части изображения с JavaScript
Действительно ли возможно показать какую-либо часть изображения в img тег (с пикселями) через JavaScript?
Я имел бы подготовленное большое изображение (например, 32x320 пикселей) и определенная стартовая позиция (X, Y, например, 0,32) и ширина/высота (например, 32,32), и захочу, чтобы сценарий показал второй (32x32 пикселя) часть основного изображения.
2 ответа
Для этого можно использовать свойства CSS и изменять их через JS. Установите изображение в качестве фона для элемента нужного вам размера и отрегулируйте его положение с помощью background-position так, чтобы была видна нужная его часть. Некоторые называют это CSS спрайтами.
Чтобы предоставить вам несколько вариантов, вы всегда можете использовать холст HTML5 и при необходимости перерисовать изображение. Вы можете найти хорошее руководство о том, как это сделать, здесь: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images Тем не менее, метод CSS-спрайтов был бы предпочтительнее, поскольку IE еще не поддерживает холст.