CODEWITHSUNDEEP
javascriptcss
Andrej Tk
Andrej Tk

Reputation: 47

Divide given value by .style.width in Javascript

I would need to divide a value given by .style.width function in Javascript. My code looks like this:

    var x = document.getElementsByClassName("item");
    var i;

    var v = x[0].style.width;

In variable 'v' I have some value in pixels, e.g. 200px width. I would need to divide this value by 2 to get 100px. But this formula doesn't work: var v = x[0].style.width / 2;

What am I doing wrong? Thanks for help.

Upvotes: 0

Views: 735

Answers (1)

brk
brk

Reputation: 50326

width will be string. Convert it to number before dividing. This example uses getComputedStyle to get actual width of a dom element

let elem = document.getElementById('test');
let compStyles = window.getComputedStyle(elem);
const widthInteger = parseInt(compStyles.width, 10);
const halfWidth = widthInteger / 2;
console.log(halfWidth)
.test {
  height: 200px;
  width: 200px;
  border: 1px solid green;
}
<div class='test' id='test'></div>

Upvotes: 1

Related Questions