Аналог `element.style.left = variable + 'px'`, только без 'px'

242
28 сентября 2017, 14:07

Имеется элемент:

let element = document.getElementById('id')

Я могу изменить его css-свойство left вот так:

let left = ...
highlight.style.left = left + 'px';

Есть ли аналог этого, только без необходимости писать 'px'?

Например, с помощью jquery можно так:

$(element).css('left', left);

А можно без jquery (и без 'px')?

Answer 1

Да. Нет. Нет.

Хотя ну ладно, на последний вопрос - да:

var $ = (function () { 
  var allowNumber = ['lineHeight']; 
 
  function $(el) { 
    if (this instanceof $) { 
      this.el = el; 
    } else { 
      return new $(el); 
    } 
  } 
 
  $.prototype.css = function (key, value) { 
    key = key.replace(/-(\w)/g, function (m, ch) { return ch.toUpperCase() }); 
   
    if (+value == value && allowNumber.indexOf(key) === -1) { 
      value += 'px'; 
    } 
     
    this.el.style[key] = value; 
     
    return this; 
  } 
   
  return $; 
})(); 
 
$(document.querySelector("div")).css('left', 100).css('line-height', 3);
div { 
  position: absolute; 
  left: 0; 
  top: 0; 
  background: silver; 
}
<div>123</div>

PS: Пиксели - зло.

READ ALSO
увеличение ширины при прокрутке вниз

увеличение ширины при прокрутке вниз

состряпал из примеров вот такой кодпо идеи он должен увеличивать ширину при прокрутке вниз и уменьшать при прокрутке вверх

234
Верстка адаптивных блоков

Верстка адаптивных блоков

Необходимо разместить три блока таким образом как на картинке с помощью flexbox

292
Рамки между элементами меню (списка)

Рамки между элементами меню (списка)

Ребят нужна помощь, как сделать так что бы рамки шли по центру между слов как показано на скриншоте:

322