Блог

Главная - Вопросы по программированию - Как изменить фон или цвет DIV с помощью jQuery colorpicker?

Как изменить фон или цвет DIV с помощью jQuery colorpicker?

#jquery

#jquery

Вопрос:

не могли бы вы, пожалуйста, помочь, я использую этот colorpicker здесь:http://www.eyecon.ro/colorpicker

и я не знаю, как это использовать, например, если я хотел бы изменить цвет фона сайта, или цвет элемента Div, или цвет текста, как это можно сделать?

вот живой пример… http://pastehtml.com/view/1e78noi.html

например, как бы хотелось изменить цвет фона, а также цвет слайдера-bg DIV и цвет текста DIV.

Пожалуйста, воспользуйтесь этим сайтом: pastehtml.com чтобы придать пурпурный цвет вашему живому и рабочему HTML-коду для показа мне. и скопируйте исходные URL-скрипты из моего исходного файла.

Спасибо

Ответ №1:

вам нужно будет использовать событие onchange, которое предоставляет colorpicker:

 $('#colorSelector').ColorPicker({
    color: '#0000ff',
    onShow: function (colpkr) {
        $(colpkr).fadeIn(500);
        return false;
    },
    onHide: function (colpkr) {
        $(colpkr).fadeOut(500);
        return false;
    },
    onChange: function (hsb, hex, rgb) {
       //this is what you need
       $(".text").css("color", "#"   hex);
    }
});

рабочий пример:

http://jsfiddle.net/r9ZeA/

Комментарии:

1. Куда мне вставить предоставленный вами код, не могли бы вы, пожалуйста, предоставить мне полный рабочий код, поскольку я совсем новичок в jquery, я буду очень признателен. вы можете увидеть мой исходный код здесь: pastehtml.com/view/1e78noi.html и вы можете опубликовать свой рабочий онлайн-код здесь, используя этот сервис: pastehtml.com Большое спасибо!

2. Спасибо! теперь, как изменить цвет всего основного фона моего веб-сайта, не могли бы вы предоставить мне рабочий образец этого, пожалуйста!

3. Вы можете использовать jQuery для управления css каждого элемента на странице. Для изменения цвета основного текста вам понадобится $ («body»).css(«background», «#» hex); Пример: jsfiddle.net/r9ZeA/1 Было бы полезно взглянуть на документацию jquery по функции .css(): api.jquery.com/css