JavaScript:Библиотеки/p5.dom/Класс p5.Element/style()

Содержание

Резерв

Резерв

Резерв

Резерв

Резерв

Библиотеки

Резерв

Резерв

Резерв

Перевод: Максим Кузьмин

Проверка/Оформление/Редактирование: Мякишев Е.А.

style()

Описание

Присваивает заданное значение заданному CSS-свойству стиля элемента. Свойство – это первый параметр, а значения – это второй, третий и так далее параметры. Если задан только один параметр, style() вернет значение заданного свойства, но если первый параметр задан при помощи синтаксиса CSS (например, так: 'text-align:center'), то style() обработает его так, будто это несколько параметров. Если первый параметр – это 'rotate', 'translate' или 'position', то следующие параметры должны иметь тип number. Это может выглядеть примерно так: ('translate', 10, 100, 50).

Чтобы использовать эту функцию, необходимо подключить библиотеку p5.dom. Для этого в заголовок своего файла «index.html» впишите следующее:

<script language="javascript" type="text/javascript" src="path/to/p5.dom.js"></script>

Синтаксис

style(property, [value], [value2], [value3])

Параметры

property – свойство, для которого нужно задать значение. Тип данных – String
value – значение, которое нужно задать эту свойству. Тип данных – String, number, p5.Color (для свойств rotate и translate – только String и number)
value2 – может понадобиться для свойств position и translate. Тип данных – String, number
value3 – может понадобиться для свойства translate. Тип данных – String, number

Возвращаемое значение

Если не задано никакого значения или объекта p5.Element, возвращает текущее значение свойства. Тип данных – String, объект, p5.Element.

Пример

№1

var myDiv = createDiv('I like pandas.');  // 'я люблю панд'
myDiv.style('font-size', '18px');
myDiv.style('color', '#ff0000');

№2

var col = color(25, 23, 200, 50);
var button = createButton('button');
button.style('background-color', col);
button.position(10, 10);

№3

var myDiv = createDiv('I like lizards.');
                   // 'мне нравятся ящерицы'
myDiv.style('position', 20, 20);
myDiv.style('rotate', 45);

№4

var myDiv;
function setup() {
  background(200);
  myDiv = createDiv('I like gray.');  // 'мне нравится серый цвет'
  myDiv.position(20, 20);
}

function draw() {
  myDiv.style('font-size', mouseX + 'px');
}