Мои сайты
- hudson играет как я играю на pc, xbox360 и других платформах
- фото-hudson мой фотоальбом, мои фото-эксперименты
Друзья
Популярные таги
ajax apache bird's eye view bromine centos cubic test doctrine facebook flash flex hints howto internet explorer java javascript jquery linux memcached monitoring munin mysql nginx patch php propel redhat ruby ruby on rails selenium selenium grid svn symfony symfony advent calendar'09 symfony deploy checklist tools web разработка Мои сайты автоматизация тестирования голдрат мысли практикум теория ограничений тестирование чтиво юморАрхив блога
Иконки в jQuery UI. Небольшой хинт по смене классов ui-state-default/ui-state-hover.
Замечательный фреймворк jQuery имеет не менее замечательную библиотеку jQuery UI. С ними мне живется в общем-то хорошо, но иногда вылезают всякие забавные грабли. Об одних я расскажу двумя строчками ниже.
Нынешние грабли связаны со стандартными иконками jQueryUI. В приложении ThemeRoller они отличненько регируют на наведение мыши:
Обычно я этими иконками не пользуюсь, но вот прижало, потребовалось сделать – чтобы быстро и красиво. Иконки вставить по образу и подобию не сложно:
<ul id="icons" class="ui-widget ui-helper-clearfix"> <li class="ui-corner-all ui-state-default"> <span class="ui-icon ui-icon-circle-triangle-w"></span> </li> </ul>Кул. НО. Не сразу, но я заметил что на hover они не реагируют. Копание в кишках UI не помогло, классы которые я пытался выдрать из примера работали (если работали) некорректно. Однако, немного порывшись в подгружаемых скриптах обнаружил следующий код:
$(function(){ //... //hover states on the static widgets $('#dialog_link, ul#icons li').hover( function() { $(this).addClass('ui-state-hover'); }, function() { $(this).removeClass('ui-state-hover'); } ); });Как говорится, ларчик просто открывался ) Hover класс биндится средствами jQuery после загрузки страницы. А еще у этих иконок плюс в том что они выполнены одним спрайтом и на hover не приходится подгружать отдельные картинки (теоретически туда можно и что-то свое дорисовать, но еще не пробовал).
Надеюсь вам этот совет поможет сэкономить 30-60 минут и потратить их на что-то полезное.