Paul Browne
Paul Browne

Reputation: 752

How do I make this responsive (refresh on window resize) Raphaeljs

So I have this script

var wide = window.innerWidth;
var high = window.innerHeight;

var paper = Raphael(0, 0, wide, high);
for (var j = 0; j < (wide / 10); j += 1) {
var multi = j * 10;
paper.path(["M", multi + 0.5, 0, "v", high]);
};

for (var j = 0; j < (high / 10); j += 1) {
var multi = j * 10;
paper.path(["M", 0,multi + 0.5, "h", wide]);
};

and I want the grid to draw to the size of the window when it is resized, if thats at all possible, plus how do i change the color of the lines?

heres a fiddle

http://jsfiddle.net/zhirkovski/7DXJ4/2/

thanks

Upvotes: 0

Views: 551

Answers (1)

christopher
christopher

Reputation: 27346

Using JQuery, you can attach it to a "resize" event, like this:

window.onresize = function(event) {
    /* Do something */
}

Using mootools, you can attach it using the addEvent() method, something like this:

$(window).addEvent('resize', function() { /* Do something */ });

And in native javascript, it's very similar to mootools. Something like:

window.addEvent('resize', function() { /* Do something */ }, false);

Upvotes: 1

Related Questions