如何向jQuery应用程序添加选项和习惯

Question

I have made a jQuery application, which I want to provide some options to it so the user will changes some values based on their prefrecens. So I have seen many plugins have some sort of options in the head tag that user can modify and they will be affected directly in the plugin. Something like this:

jQuery(function($) {
  $.MyApp({
    background : #000,
    foreground : red,
    blur : 10px
  });
});

So let's say I have a js file already that works fine, but I want to give accessibility to the user of my code to modify some default values. How can I do this? I have made a sample application that blurs the background image. JSFiddle

Can you provide some example based on my demo to see how such a structure can work and overwrite the default values? Thanks.

Answer 1

For example this is how you can provide default, but overridable option in a jQuery plugin:

$.fn.MyApp=function(options){
    var defaults={
        background : "#000",
        foreground : "#fff",
        blur : "5px"
    };
    var options=$.extend(defaults,options);

    $(this).css("-webkit-filter", "blur(" + options.blur + ")");  
};