Get CSS value in JQuery

Question

I'm using JQuery to try and get the value of the top from css.

However, where I have read a lot of things saying $('modal').css('top') will return a string "40" it is in fact retruning "40px".

Is there any way I can get this into an integer format. The component is not yet rendered on the page, I am trying to find the default position so I can set it using JS. This means that position().Top = 0 etc.

Pratik Joshi · Accepted Answer · 2015-02-17 13:01:36Z

1

Use

parseInt($('.modal').css('top'), 10);

Working Fiddle

So it will not consider px or anything

I hope model is class or id , not Blank

answered Feb 17, 2015 at 13:01

Pratik Joshi

11.7k7 gold badges44 silver badges73 bronze badges

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

3 Comments

alex Over a year ago

Is it ever possible that top value will be returned anything other than decimal?

Ryan Durrant Over a year ago

I tried this and it returned "NaN". Modal is an element passed into the funtion so ti is always pointing at the correct element.

Ryan Durrant Over a year ago

Issue was I'd copied your code and forgot to remove the '' from the modal bit and mine is a declared variable. Stupidity. This is the solution I'll use because its a bit neater. Cheers

alex · Accepted Answer · 2015-02-17 13:06:39Z

1

You can use $.fn.position() to do that...

$('modal').position().top

If that doesn't work in your situation, you could use parseInt() or parseFloat(), because some browsers will give you fractional portions of pixels in some situations.

edited Feb 17, 2015 at 13:06

answered Feb 17, 2015 at 13:01

alex

492k205 gold badges890 silver badges992 bronze badges

2 Comments

Ryan Durrant Over a year ago

The component is a popup though which is yet to be rendered, so this is returning 0.

Axel Over a year ago

@alex Please do you think you could help me with this question stackoverflow.com/questions/33054526/…

bgoldst · Accepted Answer · 2015-02-17 13:03:54Z

0

One solution involves regex replacement and cast to Number:

var topInt = Number($('modal').css('top').replace(/px$/,''));

http://jsfiddle.net/6n8xu0gf/1/

answered Feb 17, 2015 at 13:03

bgoldst

35.6k6 gold badges44 silver badges64 bronze badges

1 Comment

alex Over a year ago

You are passing a string to replace(), not a regex, so the $ would be treated literally.

Collectives™ on Stack Overflow

Get CSS value in JQuery

3 Answers 3

3 Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related