srobbin / jquery-approach

A jQuery plugin that allows you to animate style properties based on the cursor’s proximity to an object.
http://srobbin.com/jquery-plugins/jquery-approach/
GNU General Public License v2.0
167 stars 20 forks source link

Approach box rather than centre point #7

Open fgpsmith opened 12 years ago

fgpsmith commented 12 years ago

I was playing with approach to create a "fisheye" style text menu. However because the animation is based on distance from the centre of an object moving the mouse over the start or end of the text in the menus didn't cause much animation because with medium length text strings it was too far from the centre.

I have hacked the source to calculate distance from the object box rather than the centre (inside the box counts as a distance of zero) and thought that it was an option you might want to consider for future versions.

My distance code has not be optimised in anyway (as it should be for repeated calling) but it works for what I needed in the short term

function getDist(obj, x, y) { var offset = $(obj).offset(); minX = offset.left; maxX = minX + $(obj).width(); minY = offset.top; maxY = minY + $(obj).height(); var dX2 var dY2 if (x >= minX && x <= maxX) { dX2 = 0; } else { d1 = minX - x; d2 = maxX - x; dX2 = Math.min( d1_d1, d2_d2); } if (y >= minY && y <= maxY) { dY2 = 0; } else { d1 = minY - y; d2 = maxY - y; dY2 = Math.min( d1_d1, d2_d2); } return parseInt(Math.sqrt(dX2 + dY2)); }

simonhrogers commented 9 years ago

Would you be able to please post the entire .js file for this ammendment? I'm having a hard time getting this to work.