Get css value with pixels

Question

How can I get element width or height value which would be translated as a pixel number? All I got by using .css('width') are the expressions, not even a percentage number, like calc(-25px + 50%).

Edit

my code here. (Chrome)

var bars_width = element.css('width');
$('.histgram-content').css('width', bars_width);
bars_width = parseInt(bars_width.replace('px', '')) * 0.85;
$('.histgram-bar').css('width', (bars_width/data.length).toFixed(0).toString() + 'px');
/*** average Y ***/
var graph_height = $('.histgram-graph').css('height');
graph_height = parseInt(graph_height.replace('px', ''));

var average_height = $('.average-line').css('top');
average_height = graph_height - parseInt(average_height.replace('px', ''));

The average_height returns the expression I said. The last line got the result of 'NaN'.

Rory McCrossan · Accepted Answer · 2016-06-17 07:11:01Z

2

You can use any of jQuery's dimension related methods:

Working example

edited Jun 17, 2016 at 7:11

answered Jun 17, 2016 at 7:05

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

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

2 Comments

donle Over a year ago

I don't know why this is not working for me, and how about other css values like 'top'? I tried .css('top'), it directly returned the expression.

Rory McCrossan Over a year ago

Which browser are you using? Seeing your actual code would help a lot.

Fei Sun · Accepted Answer · 2016-06-17 07:32:35Z

1

Use window.getComputedStyle(),example: window.getComputedStyle($('div'))['width']

edited Jun 17, 2016 at 7:32

answered Jun 17, 2016 at 7:27

Fei Sun

5181 gold badge5 silver badges10 bronze badges

Comments

Suyash · Accepted Answer · 2016-06-17 07:07:06Z

0

You can height

$('#element-id').height();

You can width

$('#element-id').width();

answered Jun 17, 2016 at 7:07

Suyash

1765 bronze badges

1 Comment

donle Over a year ago

returns percentage value. I need pixel values

Collectives™ on Stack Overflow

Get css value with pixels

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related