Как сделать виджет YUI 3 Slider шириной 100%

Есть ли способ установить YUI 3 Slider widget как 100% width?
В атрибуте documentatiotn атрибут length установлен в px. Я пробовал с %, но не работает.

YUI().use('slider', function (Y) {
    var interval;
    var slider = new Y.Slider({
        min         : 0,
        max         : 3000,
        value       : 3000,
        length  : '100%'
    });
});

Мой сайт отзывчивый, и моя цель — использовать только 1 ползунок во всех контрольных точках медиазапросов.


javascript yui yui3
person Petroff    schedule 28.06.2014    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Если вы измените длину slider, пользовательский интерфейс будет обновлен автоматически. .

Это означает, что вы можете установить длину во время создания, а затем изменить ее, если размер окна изменится:

length  : Y.one('.slider-parent').getComputedStyle('width');

Добавьте модуль изменения размера события:

YUI().use('slider', 'event-resize' …

Логика изменения размера:

Y.on('windowresize', function () { 
    slider.set('length', Y.one('.slider-parent').getComputedStyle('width'));
});
person Jonas G. Drange    schedule 30.06.2014