Показать сообщение отдельно
  #6 (permalink)  
Старый 22.10.2015, 00:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,134

canvas зеркальное отражение
Sakyra,
<!doctype html>
<html>
<meta charset='utf-8'>
<head><title></title></head>
<body>
<canvas id='image' width="500" height="375" ></canvas>
<script>
var k = .6,
    img = document.getElementById('image'),
    context = img.getContext('2d'),
    pic = new Image();
pic.onload = function () {
  context.canvas.width = pic.width;
  context.canvas.height = pic.height*(1 + k);
  context.drawImage(pic, 0, 0, pic.width, pic.height)
  context.translate(0, pic.height)
  context.scale(1, -1);
  context.drawImage(pic, 0, -pic.height*k, pic.width, pic.height*k)
};
pic.src = 'http://berimus.ru/uploads/thumbs/c/9/4/c94b13fe0561c596ce800e7d24e8da78.jpg';
</script>
</body>
</html>
Ответить с цитированием