Home/ Questions/Q 7678967
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T17:46:05+00:00

I have written a small plugin to change the text size but it doesn’t

  • 0

I have written a small plugin to change the text size but it doesn’t seem to work properly.
$(‘#mypara’).changeTextSize(’30px’); doesn’t set the size to 30px but instead sets to 10px

jquery.myPlugin.js

jQuery.fn.changeTextSize = function(size){
alert(size);    //shows 30px        

var config = {
    'size' : '10px'
};
if(size) {
    $.extend(config,size);
}

alert(config.size); //shows 10px

return $(this).each(function() {
    $(this).css('font-size',config.size);
});

};

HTML

<script type = "text/javascript" src="jquery-1.7.1.js"></script>
<script type = "text/javascript" src="jquery.myPlugin.js"></script>

<script>
$(document).ready(function() {
    $('#mypara').changeTextSize('30px');    
}); 
</script>

</head>
<body>
<p id="mypara">dsfdsfdsf</p>

</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The extend function is used to merge objects. You are trying to merge a string, size, into an object literal, config. You would need to pass an object as the argument to your plugin:

    $('#mypara').changeTextSize({
    size: '30px'
});

    Here’s a working example.

    Alternatively, if that’s the only argument and there’s not going to be more options, it may be easier to forget about using extend at all, and just do something like this:

    jQuery.fn.changeTextSize = function(size){ 
    return this.css('font-size', size || "10px");
};

    Notice how I’ve removed the each, since there is no need for it (most jQuery methods apply to every element in the matched set by default), and you also don’t need to pass this into jQuery since it is already an instance of jQuery.

    Here’s a working example of that one.

    • 0