markerPen is a simple jQuery plugin to incorporate the function of marking contents on a webpage. This plugin would come handy if you are creating webpages for academic purpose where a person can mark details while reading through a huge junk of data.


The plugin comes with five functions

You can use the marker to make markings on the page and the Eraser to erase them. The Clear will delete all the markings you have done on the page. The Enable/Disable markerPen feature lets you switch the control between the plugin and the webpage. And while the markerPen is disabled, you can hide or show the markings on the page.

You can set up the plugin in two simple steps

Step 1 : Include JS Files

Step 2 : Initialize JS

$(document).ready(function() {

More Options

You have three options to specify while initializing the plugin. You can change the color, stroke width and the transparency of the markings. If you don't specify them then the default color is yellow, stroke width is 10 and the opacity is 0.7 .

$(document).ready(function() {