jQueryUI selectable: не может применить тему к выбранному элементу (класс «ui-selected»)

Question

Я разрабатываю приложение с использованием jQueryUI. Я также использую Themeroller. Я хочу иметь как можно больше моих стилей с помощью темы, поэтому, если мне нужно изменить некоторые стили, мне просто нужно создать новую настраиваемую тему (или загрузить существующую тему).

Я пытаюсь использовать «выбираемое» взаимодействие в jQueryUI. Он работает так, как должен - в Firebug я вижу, что класс «ui-selected» применяется к элементу, который я выбираю. Тем не менее, нет визуальной подсказки, что элемент был выбран. Я просмотрел файл CSS (jquery-ui-1.8rc3.custom.css, который я загрузил с Themeroller page), и я не вижу объявления для класса «ui-selected». Когда я загрузил jQueryUI и тему, я проверил каждый вариант, в том числе один для «selectable».

Как я могу сделать свою тему определением класса «ui-selected»? Очевидно, я мог бы просто создать свою собственную декларацию стиля, но это решение не идеально, если я когда-либо захочу изменить тему.

Я использую jQuery 1.4.2 и jQueryUI 1.8rc3.

Answer 1

Извините, ответ отстой, но вы не можете.

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

Если вы посмотрите на demo pages, они также вручную сделать заявление стиля для .ui-selected

Answer 2

Вы можете динамически устанавливать классы пользовательского интерфейса, как это:

$("#selectable ul").selectable({ 
    unselected: function(){ 
    $(".ui-state-highlight", this).each(function(){ 
     $(this).removeClass('ui-state-highlight'); 
    }); 
    }, 
    selected: function(){ 
    $(".ui-selected", this).each(function(){ 
     $(this).addClass('ui-state-highlight'); 
    }); 
    } 
}); 
$("#selectable li").hover(
    function() { 
    $(this).addClass('ui-state-hover'); 
    }, 
    function() { 
    $(this).removeClass('ui-state-hover'); 
    } 
);