Wiki

Clone wiki

jquery.holedDiv / Home

jQuery Holed Div

This is jquery.holedDiv a jQuery plugin that allows you to create div with a holed background. It uses canvas to draw the background. Also supports rounded corners.

Demo

It supports modern browsers like Chrome, Firefox, Opera and Internet Explorer 9. It also supports IE < 9 with excanvas And as a limited support for older browsers (with css and images)

Usage

$('div.info').holedDiv({
      'radius': 10, //0 if you don't want rounded borders
      'stroke': false, //if you want to add a (black) stroke to the background
      'holeRadius': 20,
      'drawInner': true, //if you want to draw an inner circle, like the demo
      'drawInnerColor': 'black' //the color of the inner circle
});

Demo

You can see a demo of this plugin here.

Updated