Get new jQuery plugins just once a week

×

traceit-js

June 4, 2014

traceit-js | jQuery plugin to dynamically trace page elements

traceit-js is a jQuery plugin based on raphael.js that lets you dynamically trace page elements.
jquery.traceit.js adds a dynamic trace to any element on a page; configure its stroke width, animation speed, stroke/fill color and opacity as well as onHide, onEndTrace and onClick callback functions.

Example Code :-

$('#elem').trace({
traceCanvasPadding: 10,
redrawSpeed: 3500,
traceDivPref: "_wrap",
traceCursor: 'pointer',
traceOpt: { 'stroke': 'yellow', 'stroke-width': 5,
'stroke-opacity': 1, 'fill': 'none',
'fill-opacity': 0, 'zindex': 9999},
isVisible: true,
useRelativePositioning : false, // will position relative to the document by default
onHide: function() { console.log("From hide Callback") },
onEndTrace: function() { console.log("From end Trace Callback") },
onClick: function(me){ me.options.shape.animate({opacity: 0}, 1000, function(){ me.hideTrace(); }); }
}
);

Created by Yuna Portnoy

Download

Example

traceit-js jQuery plugin

trace elements

traceit-js

Related posts:

Open js grid
WhatsNearby
rollerblade-js
traceit-js jQuery plugin

http://jquer.in/wp-content/uploads/2014/05/traceit-js.jpg

jQuery plugin

Sign up for our weekly newsletter.

* We won't spam you ever