LESS - установить переменные на стороне клиента - PullRequest
Новая
       3

LESS - установить переменные на стороне клиента

1 голос
/ 03 января 2012

Я создал LESS (http://lesscss.org/) версия простого решения для сетки CSS (http://simplegrid.info/.) Теперь я могу с радостью свернуть свои собственные размеры сетки с помощью серверного скрипта от LESS (lessc). для меня.

В демонстрационных целях я хотел бы создать страницу HTML, где я могу поместить размер сетки CSS в текстовое поле, и сетка будет меняться динамически. Начало демонстрации здесь:

http://jsfiddle.net/8QHNc/

Поэтому вместо изменения @layoutwidth: 720px; в разделе <style rel="stylesheet" type="text/less" > я бы хотел передать эти переменные интерпретатору LESS.

Можно ли это сделать с использованием клиентской стороны less? Могу ли я как-то определить глобальные переменные или передать их как параметры в less.js?

Я знаю, что мог бы сделать это без использования LESS (предпочтительно с jQuery o. Sth.) - но я решил, что он уже есть ...

Ответы [ 2 ]

2 голосов
/ 13 января 2012

Я не знаю, принимает ли парсер какие-либо аргументы, но почему бы вам отказаться от использования встроенной оценки javascript, например, добавить что-то вроде: 

@layoutwidth: `document.getElementById("inputLayoutWidth") + "px"`;

в таблицу Less-StylesИли, используя jQuery, как вы предложили: 

@layoutwidth: `$("#inputLayoutWidth").val() + "px"`;

при использовании поля ввода, например 

<input type="text" id="inputLayoutWidth" value="720" />

, и вызывайте анализ при каждом изменении поля ввода.

1 голос
/ 06 декабря 2016

Если вы используете версию 3.x с меньшим количеством CSS, чем вы можете установить их также в коде javascript. 

 less.modifyVars({
   '@buttonFace': '#5B83AD',
   '@buttonText': '#D9EEF2'
});

Я не знаю, присутствует ли этот метод в более старой версии less.

...