Geek's Retreat

[...] ;To make the ‘bad guys’ move we need to alter the ‘move’ method of the Thing object.  To do this we need to make use of the direction and speed properties we added to the [...]

[...] passed into the ‘createThing’ function. It is this function that creates a new thing object: The function consists of three lines of code. The first line declares two variables. The [...]

In this post I’ll cover the basics of implementing drag and drop with collision detection using the Canvas element and JavaScript. The end result wi [...]

[...] move on to the code to draw the explosion, let’s look at the Explosion object. Like the Thing object each Explosion uses Cartesian coordinates for its position.  The Explosion object also [...]

[...] To fully understand how this works we next need to look into the draw function of the ‘Thing’ object: The above function uses various native function calls to the canvas’ [...]

[...] we need to draw each of the items within the sprites array onto the canvas: Earlier we added a draw function to the Thing object, thus, we simply iterate through the array and tell each Thing to draw [...]

[...] a new method to the Thing object’s prototype: We then call the method within the draw function: This almost perfectly animates our ‘bad guys’, however, if the starting [...]

[...] . These classes are called ‘sec1′ and ‘sec2′. They reference two CSS animations ‘spin’ and ‘spinr’ e.g. The CSS animation above labelled ‘spin& [...]

[...] the Android UI guidelines recommend a minimum tap target size of roughly 7mm, or 48 CSS pixels on a site. Response with Appropriate Content Another recommendation is to never scale down [...]

[...] us to rotate each side into place. The transform-origin property is used in conjunction with CSS rotate and transform, permitting control of the origin of a transform. To further understand this let [...]

In this post I’ll cover the basics of implementing drag and drop with collision detection using the Canvas element and JavaScript. The end result wi [...]

[...] ‘bad guys’. To load the target graphic as an asset we have to modify the loadSprite function as follows: We also need to bind the event related to the mouse movement to a [...]