CODEWITHSUNDEEP
jquerycss
Houman
Houman

Reputation: 66320

How to define overflow-y?

I don't understand why it doesn't like my overflow-y syntax?

enter image description here

function show_modal(target){
    $(target).modal({
        backdrop: true,
        keyboard: true
    }).css({
        width: 'auto',
        overflow-y: 'hidden',
        'margin-left': function () {
            return -($(this).width() / 2);
        }
    });
    $(target).modal('show');
}

Upvotes: 3

Views: 3286

Answers (2)

Lie Ryan
Lie Ryan

Reputation: 64837

overflow-y is overflow minus y, which is a syntax error since the key part of an object literal must be either an identifier, a string literal, or a numeric literal, not an expression. To use the overflow-y property, you can quote the property name into a string literal like so: 'overflow-y': 'hidden',

Upvotes: 2

user1726343
user1726343

Reputation:

The DOM exposes CSS properties as camelcased versions of themselves. Try using overflowY instead.

As a general note, to put a hyphen in an object key name, you need to use quotes:

{
    "width": 'auto',
    "overflow-y": 'hidden',
    "margin-left": function () {
        return -($(this).width() / 2);
    }
}

I am not sure if jQuery automatically maps the CSS names to the corresponding DOM versions, so it is best to use overflowY instead.

As Chris Heald has pointed out, jQuery does in fact accept the hyphenated property name as well as the camel cased one, so either of overflow-y (provided you use quotes) or overflowY should work.

Upvotes: 3

Related Questions