Tuesday, October 29, 2013

Canvas Jigsaw Puzzle (Kineticjs and jQuery)

After a long time I am posting another one which is related to jQuery and HTML5. I have created a Jigsaw puzzle using Kineticjs and jQuery 1.9. Please have a look.

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"/>
<title>Jigsaw Puzzle</title>
<link href='http://fonts.googleapis.com/css?family=ABeeZee' rel='stylesheet' type='text/css'>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1.9.1.js"></script>
<script src="js/kinetic-v4.7.2.min.js"></script>
<script type="text/javascript" src="js/document.js"></script>
    <div id="wrap">
          <h2>Jigsaw Puzzle</h2>
          <img id="logo" src="images/logo.png" alt="">
          <div id="start">START</div>
          <h3>Choose your difficulty level.</h3>
          <div class="option">EASY</div>
          <div class="option">MEDIUM</div>
          <div class="option">HARD</div>
          <div id="canvas_wrap"></div>


No comments: