Salve a tutti.

Ho questo codice che evidenzia la riga e la colonna della tabella al passaggio del mouse
<script type="text/javascript">
// <![CDATA[


function foobar(el) {
/* event delegation */


var table = $(el);
var tbody = $('tbody', table);


table.bind('mouseover', function(event) {
var el = event.target;


if (el.nodeName === 'TD') {


var td = $(el);
var tr = td.parent();
col = tr.children().index(td) + 1;


$(['td:nth-child(', col, ')'].join(''), tbody).addClass('tdhovered');
$(tr, tbody).addClass('trhovered');


}
});


table.bind('mouseout', function() {
$('td', table).removeClass('tdhovered');
$('tr', table).removeClass('trhovered');
});
};


$(document).ready(function() {
foobar('table');
});


// ]]>
</script>

Come faccio a modificarlo per fare in modo che vengano evidenziate le celle della riga e della colonna fino al mouse e non oltre, mi spiego.... che si formi un angolo retto riga-colonna dal punto in cui è posizionato il mouse.