LED Concept in HTML5



The mesmerizer






Mouse Over on grid or type alphabets to see the animations

(Note: This HTML5 Canvas concept will not work in Internet Explorer)

Step-1 Open a new HTML document.
Step-2 Paste the below code and save it as led.html.

<!DOCTYPE html>
<html><head>
<title>The mesmerizer</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="https://www.searchenginegenie.com/web-design/ga.js" async="" type="text/javascript"></script><script type="text/javascript" src="https://www.searchenginegenie.com/web-design/jquery-1.js"></script>
<script type="text/javascript" src="https://www.searchenginegenie.com/web-design/main-canvas.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push([‘_setAccount’, ‘UA-1365544-2’]);
_gaq.push([‘_trackPageview’]);
(function() {
var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body class="mesmerizer" style=" background-color:#FFF; margin:0px; padding:0px;">
<canvas id="pixelCanvas" width="500" height="500" style=" top:-150px;"></canvas><br>
</body></html>

Step-3 Download the below js file and attach it to the html document.
jqeury-1.js
ga.js
main-canvas.js

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *