2012/05/24
Windows Gadget에 HTML5 적용하기
Windows Gadget에 HTML5를 적용하는 방법을 찾아 보았다.
검색을 해 보았지만 쉽게 나오지 않았다. 어렵사리 찾았는데 방법이 생각보다 쉬웠다. 레지스트리를 수정하는 것도 아니고 단순히 HTML 파일에 아래 내용만 더 기술하면 되는 것이였다.
물론 시스템에 IE9가 설치 되어 있어야 한다.
HTML5의 중요한 속성중 하나인 Canvas를 테스트 해 봤다.
(HTML5 Canvas 소스 출처: http://www.w3schools.com/html5/html5_canvas.asp)
실행한 결과 아래와 같이 HTML5 Canvas위에 그라데이션이 그려졌다.
&
Original Post : http://neodreamer-dev.tistory.com/657
검색을 해 보았지만 쉽게 나오지 않았다. 어렵사리 찾았는데 방법이 생각보다 쉬웠다. 레지스트리를 수정하는 것도 아니고 단순히 HTML 파일에 아래 내용만 더 기술하면 되는 것이였다.
<!DOCTYPE html>
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
물론 시스템에 IE9가 설치 되어 있어야 한다.
HTML5의 중요한 속성중 하나인 Canvas를 테스트 해 봤다.
(HTML5 Canvas 소스 출처: http://www.w3schools.com/html5/html5_canvas.asp)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
<meta http-equiv="Content-Type" content="text/html; charset=Unicode" />
<style type="text/css">
body
{
margin: 0;
width: 200px;
height: 100px;
font-family: verdana;
font-weight: bold;
font-size: 20px;
}
#gadgetContent
{
margin-top: 0px;
width: 100%: middle;
text-align: center;
overflow: hidden;
}
</style>
</head>
<body>
<div id="gadgetContent">
Canvas
<canvas id="myCanvas" width="200" height="50"></canvas>
</div>
</body>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var grd=ctx.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"#FF0000");
grd.addColorStop(1,"#00FF00");
ctx.fillStyle=grd;
ctx.fillRect(0,0,175,50);
</script>
</html>
실행한 결과 아래와 같이 HTML5 Canvas위에 그라데이션이 그려졌다.
Original Post : http://neodreamer-dev.tistory.com/657
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment