jQuery - extend css()

Question

As jQuery .css() dont work if I want to get css value of margin, padding.

I found a jquery code which solve this this bug.

Please help me to extednd jquery .css() by adding this code:

$.each(['border', 'margin', 'padding'], function (i, name) {
        $.fn[name] = function (value) {
            if (value) {
                if (value.top !== undefined) {
                    this.css(name + '-top' + (name === 'border' ? '-width' : ''), value.top);
                }
                if (value.bottom !== undefined) {
                    this.css(name + '-bottom' + (name === 'border' ? '-width' : ''), value.bottom);
                }
                if (value.left !== undefined) {
                    this.css(name + '-left' + (name === 'border' ? '-width' : ''), value.left);
                }
                if (value.right !== undefined) {
                    this.css(name + '-right' + (name === 'border' ? '-width' : ''), value.right);
                }
                return this;
            }
            else {
                return {top: num(this.css(name + '-top' + (name === 'border' ? '-width' : ''))),
                        bottom: num(this.css(name + '-bottom' + (name === 'border' ? '-width' : ''))),
                        left: num(this.css(name + '-left' + (name === 'border' ? '-width' : ''))),
                        right: num(this.css(name + '-right' + (name === 'border' ? '-width' : '')))};
            }
        };
    });

Hre is the fiddle which shows that jquery .css() fails getting value of padding and margin, in firefox browser

http://jsfiddle.net/howtoplease/fMTsW/4/

What are you asking? Did you try the code? Did it not work or something? — Paul
– Paul, Commented Jul 19, 2013 at 4:42
yes work in chrome but fails in firefox, I want to use above code to extend css() function — user007
– user007, Commented Jul 19, 2013 at 4:45

RONE · Accepted Answer · 2013-07-19 05:41:53Z

1

i have a solution, have a look at this.

$(document).ready(function(){
       ....
           $('[name='+this.name+']').val(marginT);
           .....
       }else{         
        this.value = $('h3').css(this.name);
       }
    });
});

WORKING DEMO

The above code is my own logic, I have also implemented the code that you have provided.

Your Plugin function

This plugin also has issue, check the console.log displayed.

answered Jul 19, 2013 at 5:41

RONE

5,5059 gold badges45 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user007 Over a year ago

demo fails if margin:40px 50px;

Collectives™ on Stack Overflow

jQuery - extend css()

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related