2016-03-18 7 views
0

Здесь много дискуссий о динамическом обновлении цвета с использованием LESS, например: dynamically change LESS variables in page with JavaScript. Но мне еще предстоит увидеть то, что конкретно касается моей задачи.Получить динамический цвет фона, применить к отдельному элементу, используя LESS

Наша фирма предоставляет веб-программное обеспечение, которое обеспечивает пользователям широкую гибкость в отношении пользовательского интерфейса, включая общий цвет фона. Но есть ряд элементов, которые они не могут изменить, которые должны иметь цвет фона, чтобы обеспечить надлежащий пользовательский опыт (ср. Мой вопрос с Glyphicon Bootstrap here - обязательно приветствовал бы там ответ). Я хочу найти решение, которое принимает все, что пользователь устанавливает в качестве фона в любой момент времени, и динамически применяет его к другим элементам. Я мог бы сделать это с помощью Javascript, но похоже, что я должен использовать наше использование LESS в нашем стеке приложений, чтобы эффективно создавать неустановленный mixin, который динамически обновляется на основе пользовательского пользовательского интерфейса. Я пробовал много попыток сформировать решение LESS, но безуспешно.

Я лаю неправильное дерево? Прежде чем отправиться на маршрут JS, я хотел бы посмотреть, может ли кто-нибудь предложить LESS-решение для этой задачи. Как всегда, заблаговременно за помощь, которую вы могли бы предоставить здесь.

ответ

1

Я обычно не использовать LESS в браузере, но идущий по документации, предоставленных here можно связать с файлом JavaScript, который компилирует меньше файлов в

<!-- Here: include any less plugin scripts, any required browser shims and optionally set less = any options --> 
<script src="less.js"></script> 
<link rel="stylesheet/less" type="text/css" href="styles.less" /> 
<link data-dump-line-numbers="all" data-global-vars='{ "myvar": "#ddffee", "mystr": "\"quoted\"" }' rel="stylesheet/less" type="text/css" href="less/styles.less"> 

даже лучше подхода будет иметь конфигурацию управляемого генератора CSS, который генерирует файл CSS на основе набора параметров и получает подается через CDN.

1

просто использовать переменный меньше, но вам нужно будет transpile в браузере или иметь повторно сервера transpile в CSS на переменных изменениях