JQuery добавить CSS декларации? - PullRequest
Новая
       5

JQuery добавить CSS декларации?

2 голосов
/ 27 июля 2011

Возможно ли с помощью jquery добавить новые объявления стилей?

Например, передать: 

{ "body": { "font-size": "12px" }, "table": { "xyz": "123" } }

и т. Д. И т. Д.

в функцию, которую я не знаюбез необходимости выбирать эти элементы и делать это следующим образом: 

$('body').css({"font-size": "12px"});
$('table').css({"xyz": "123"});

И вторая часть вопроса: можно ли установить css для псевдокласса: hover с помощью jquery или мне нужно использовать.функция hover ()?Если возможно, я просто хочу применить CSS и не иметь дело с функциями ввода / вывода мыши. 

$('#element').find('a.thumbnail:hover').css({'background-color': '#efefef' });

не работает.

Спасибо, Уэсли

Ответы [ 5 ]

6 голосов
/ 27 июля 2011

Вы можете изменить саму таблицу стилей с помощью чистого javascript через коллекцию document.stylesheets.подробнее здесь: http://www.howtocreate.co.uk/tutorials/javascript/domstylesheets

Вы также можете использовать плагин jQuery jRule для достижения тех же результатов: http://flesler.blogspot.com/2007/11/jqueryrule.html

4 голосов
/ 27 июля 2011

Ответ на часть 1:

Для этого вам нужно определить функцию - попробуйте что-то вроде этого: 

function styleit(json)
{
    //loop through the json
    $.each(item, function(i, style){
      //apply styles
      $(i).css(styles);
    }
}

Ответ на часть 2:

Я бы поместил объявление css в такой класс: 

.active a.thumbnail:hover { background-color: #efefef; }

Затем используйте javascript для переключения класса в контексте родительского элемента 

$('#element').addClass('active');
0 голосов
/ 27 июля 2011

Попробуйте: 

$('a.thumbnail').hover(
    function(){
        $(this).css({'background-color':'#efefef'});
    },
    function(){
        $(this).css({'background-color':'normal-color'});
    }
);

Пример: http://jsfiddle.net/jfhpg/1/

Надеюсь, это поможет.

0 голосов
/ 27 июля 2011

Для первой части вы правильно добавляете стили к тегам body и table.

Для второй части это решение, при использовании .hover(), кажется более простым решением: 

$('#element').hover(function() {
    $(this).css({'background-color': '#efefef' });
});
0 голосов
/ 27 июля 2011

Вы должны сделать это, выбрав только элемент dom.Кроме того, чтобы установить стили при наведении, вы должны либо установить стили, используя css, либо добавить / удалить имена классов.

...