<link href="http://www.jqueryscript.net/css/jquerysctipttop.css" rel="stylesheet">

HTML

<script src="http://anthonyterrien.com/js/jquery.knob.js"></script>
 

<input class="knob" type="text" value="100" data-angleOffset="120" data-angleArc="120" data-fgColor="red" data-displayInput="false" />
<input class="knob" type="text" value="100" data-angleOffset="0" data-angleArc="120" data-fgColor="green" data-displayInput="false" />
<input class="knob" type="text" value="100" data-angleOffset="240" data-angleArc="120" data-fgColor="blue" data-displayInput="false" />

JavaScript

$(function () {
    $('.knob').knob({});
    $('.knob').parent('div').css('position', 'absolute');
    
    $('.knob').parent('div').children('canvas').mousemove(function(event) {
        $.each($('.knob').parent('div').children('canvas'), function(key, value) {
            var canvas = value;
            var context = canvas.getContext('2d');
            
            var position = getElementPosition(canvas);
            var x = event.pageX - position.x;
            var y = event.pageY - position.y;
            
            var color = context.getImageData(x, y, 1, 1).data;
            
            if(color[0] == 0 && color[1] == 0 && color[2] == 0) {
                $(canvas).parent('div').css('z-index', '-1');
            }else {
                $(canvas).parent('div').css('z-index', '1');
            }
        });
    });
});

function getElementPosition(element) {
    var currentLeft = 0;
    var currentTop = 0;
    
    if(element.offsetParent) {
        do {
            currentLeft += element.offsetLeft;
            currentTop += element.offsetTop;
        }while(element = element.offsetParent);
        
        return { x: currentLeft, y: currentTop };
    }
    
    return undefined;
}