Check if max width is set in jQuery?

Question

I am trying to check if the inline style has already been applied by jQuery.

Normally I would do something like this:

if ($(this).css('max-width') == '20%') {}

However, I do not know the percentage. What is the best way to check if any maximum width applies?

Answer 1

By default, .css('max-width') will return "none" if max-width not defined, so the following job should complete the job:

 if ($(this).css('max-width') !== 'none') { ... } 

If you need to check only the inline style, which means that you are overriding the original CSS max-width property (for example, from a stylesheet file), you can do the following:

 if (this.style.maxWidth !== '') { ... } 

... as pure maxWidth style property will be empty "" if the CSS property has not been set.

Answer 2

 if ( $(this).css('max-width')!='none' ) { } 

Answer 3

If the max-width property is not applied on an element, it returns none . Try checking none

 $(this).css('max-width') =='none' 

OR

 if( $('#element').css('max-width') =='none' ) { // max-width not EXISTS } else { // max-width EXISTS } 

Check only inline style :

 if($('#element').attr('style') != 'undefined'){ if( $('#element').attr('style').indexOf('max-width') == -1 ) { // max-width not EXISTS } else { // max-width EXISTS } } else { // Inline style not EXISTS } 

OR

I recommend using the jQuery selector. Attribute contains a word selector

 $('div[style ~= "min-width:"]') 

Working script