help with writing jquery plugin

[sadunaresh]

Hi,

I was working with jquery for last 3 months.. I am well acquainted working with functionality but never tried to write a plug in… just started experimenting with above functionality.. coded as below..

$.fn.calculateDistance = function(elem, mouseX, mouseY) {
return Math.floor(Math.sqrt(Math.pow(mouseX – (elem.offset().left+(elem.width()/2)), 2) + Math.pow(mouseY – (elem.offset().top+(elem.height()/2)), 2)));
};

$(document).ready(function(){

var mX, mY, distance, $distance = $(‘#distance span’), $element = $(‘#element’);
$(document).mousemove(function(e) {
mX = e.pageX;
mY = e.pageY;
distance = calculateDistance($element, mX, mY);
$distance.text(distance);

});

});

doing so gives me an error

**calculateDistance is not defined**

where am I going wrong?

[sadunaresh]

@jamy_Za … thank you for sharing the useful link and making me understand where I have gone wrong….

[sadunaresh]

@crocodillon …. thank you for the solution

[sadunaresh]

@jamy_za… you mean I should start writing functions as specified in your mentioned link as below..? correct..?

this will keep my code clean, grouped, manageable and readable.. right…?

(function($){
jQuery.fn.extend({

//Options is added within the brackets after function
// This informs the plugin that options will be used
redBorder: function(options) {

//Defaults options are set
var defaults = {
border: “3px solid red”
};
var options = $.extend(defaults, options);

return this.each(function() {

jQuery(this).css(“border”, options.border);

});

}

});
})(jQuery);

correct me if I understood wrong..

[sadunaresh]

@jamy_za… yep.. got it… I got it what you meant… thank you for guiding me.. this is an important note for someone like me who just started learning jquery the right way…

[Author]

Posts