html - Cutting an Image into pieces through Javascript -



html - Cutting an Image into pieces through Javascript -

i creating simple jigsaw puzzle. in order this, need cutting image using 20 pieces. there way in javascript cutting image 20 equal pieces , save them 20 different objects within webpage? or have go photoshop , cutting each image out myself , phone call in?

you can setting image background on div, setting background-position. same using css sprites.

(assume pieces 100 x 100px)

<div class="puzzle piece1"></div> <div class="puzzle piece2"></div>

css:

.puzzle { background-image:url(/images/puzzle.jpg); width:100px; height:100px; } .piece1 { background-position:0 0 } .piece2 { background-position:-100px -100px }

javascript html html5

Comments

Popular posts from this blog

How do I check if an insert was successful with MySQLdb in Python? -

delphi - blogger via idHTTP : error 400 bad request -

postgresql - ERROR: operator is not unique: unknown + unknown -