회전 자바 스크립트 이미지

Question

자바 스크립트에서 이미지를 회전하고 싶습니다. 자바 스크립트에서 이미지에 사용 된 변수는 heroImage입니다. jquery rotate를 사용하고 있는데, 이미지를 HTML로 회전시킬 때만 잘 동작하지만 자바 스크립트에서는 회전하지 않습니다. 는 일반적으로는이

$("#image").rotate(angle); 

과 같은 형태 그러나 그것은 단지 HTML에서 만든 이미지를 사용할 수 있습니다.

이 현재

var heroImage = new Image(); 
heroImage.src = "images/hero.png"; 

등을 사용하여 코드 메신저의 일부는 그 도움이된다면, 캔버스 그려. 문제는 #image가 html div 요소 afaik 만 참조 할 수 있다는 것입니다. heroImage 변수가 파일 이름을 포함하는 문자열 인 경우

Answer 1

, 단지 새로운 이미지를 만들고 rotate()를 호출하기 전에 DOM에 추가, f.ex :

var heroImage = 'one.jpg'; 
var image = new Image(); 
image.src = heroImage; 
$('#image').append(image).rotate(angle); 

편집 #image하는 경우 요소가 인 경우 다음과 같이 시도하십시오.

var heroImage = 'one.jpg'; 
var image = new Image(); 
image.src = heroImage; 
document.body.appendChild(image); // or wherever you want to put it 
$(image).rotate(angle);