Help debug a little plugin
This plugin is to make an element the same size with other one.
- (function($){
- $.fn.fitSize = function(options){
- var defaults = {
- target_object:'',
- fitWidth:true,
- fitHeight: true
- },
- settings = $.extend({},defaults, options);
-
- return this.each(function(){
-
- var $this=$(this);
- if(settings.fitWidth == true) {
- var fake_width = $this.outerWidth(true)-$this.width();
- $this.width(settings.target_object.width()-fake_width);
- }
- if(settings.fitheight == true){
- var fake_height = $this.outerHeight(true)-$this.height();
- $this.height(settings.target_object.height()-fake_height);
- }
- });
- }
- })(jQuery);
Run
- <!DOCTYPE HTML>
- <html>
- <head>
- <style>
- #a{width:400px; height:600px; background:#66C}
- #b{background:#FC3}
- </style>
- <script>
- $(function(){
- $('#b').fitSize($('#a'));//make b the same size with a
- });
- </script>
- </head>
- <body>
- <div id="a"></div>
- <div id="b"></div>
- </body>
- </html>
Firebug error: settings.target_object.width() function is not defined.