ShiftSpace / rounded-image

Rounded images using canvas.

Rounded Image

This library fixes the broken combination of images with the CSS3 border-radius style in Firefox. Safari 4 has the correct behavior. We are working on supporting more browsers (IE7/IE8). Help appreciated :)

Usage

You can define CSS like so:

.myimagea {
  -moz-border-radius: 20px 0px 0px 20px;
  -webkit-border-top-left-radius: 20px;
  -webkit-border-bottom-left-radius: 20px;
}

You markup should look like this:

<img class="rounded-image myimagea" width="160" height="120" src="form.jpg"></img>

When the page loads call the following:

RoundedImage.init();