redimensionar imagens com lona - problema de estouro de css

Question

Eu estou trabalhando em um recurso de redimensionamento da imagem JavaScript que dependem do IE única addon DXImageTransform.

Querendo endereço navegadores modernos, bem, eu dei um tiro à lona, ??com bons resultados bonitas.

No entanto, eu enfrento um problema na minha função de redimensionamento, que é o seguinte:

function Resize(oObj, flMultiplier)
{       
  var canvas = document.getElementById('canvas');
  var canvasContext = canvas.getContext('2d');

  oObj.style.visibility = 'hidden';

  canvasContext.clearRect(0,0,canvas.width,canvas.height); // clear canvas
  canvasContext.fillStyle = 'rgba(0,0,0,0.4)';
  canvasContext.scale(flMultiplier,flMultiplier);
  canvasContext.drawImage(oObj, 0, 0);
}

Se a minha imagem torna-se maior do que o item tela, em seguida, um vai ver apenas uma parte da imagem, o que é ruim.

Eu tentei ajustar o tamanho da tela em tempo de execução, mas se afeta a exibição da imagem redimensionada.

Então eu acabou declarando um grande elemento de tela, que é bastante OK, exceto que o estouro de css da minha página web é ajustado em minha maior elemento, e não sobre a minha imagem redimensionada, que é uma dor.

Então, eu acho que existem duas maneiras de resolver o meu problema:

1. Tente excluir o elemento de tela grande do esquema estouro
2. Tente atualizar o tamanho do elemento de tela ao redimensionar (Talvez eu tenha perdido alguma coisa lá)

Answer 1

Eu não tentei isso sozinho, mas talvez você pode criar um elemento de tela para fora do Dom, com document.createElement. Poderia ser de tamanho arbitrário, sem perturbar o display.

Agora, eu falta de contexto (por que você redimensionar imagens desta forma em vez de usar largura e altura atributos, entre outras questões) então talvez eu estou perdendo o ponto.