SVG icons on Internet Explorer

When testing my website (which runs smoothly on Chrome) on Internet Explorer, I was surprised to see my SVG icons did not show up and even caused an error:

```
SCRIPT5022: InvalidStateError
File: canvasreplay.js, Line: 326, Column: 11
```

After some investigation, I found out IE does not know the size of the SVG icon (see also [1]) causing

```
context.drawImage(image, originX, originY, width, height,
              x, y, width * pixelRatio, height * pixelRatio);
```

to fail, as `width` and `height` both equal zero.

Although this can be fixed easily by providing a `size` to `ol.style.Icon`, I'd rather have no icon than a crashing library. See the first commit of this PR for a solution.



After running my website several times using this fix, I randomly get either the same error, or this one:

```
SCRIPT65535: Unexpected call to method or property access.
File: iconstyle.js, Line: 427, Column: 3
```

I checked the `image` variable in `canvasreplay.js:236` and apparently another 'empty' image is added: `<canvas width="0" height="0"></canvas>`, even though `width` and `height` (the variables, _not_ the `image` attributes) are non-empty now. This image is the 'hit detection icon', making my icons interact. Again, the SVG icons have no size (according to IE), so the hit detection icon has none either. See the second commit of this PR for my solution.

[1] <http://stackoverflow.com/questions/4472086/getting-image-width-on-image-load-fails-on-ie>

Edit: added a link to stackoverflow, which may contain a better solution.
I was. But then I found this solution to be more elegant.
Thanks for your feedback.