Question

I have an image as a background in Raphael.

I want to display only a portion of this image at any given time.

How do I do that?

Answer 1

You can use the clip-rect attribute to display only a select areas of the image like this

var paper = Raphael(0, 0, 964, 641);
var background = paper.image("image.jpg",0,0,964,641);
background.attr({"clip-rect":"0,0,200,200"});

Here is the FIDDLE

​