Как изменить цвет фона (не текст) с помощью javascript?

Question

Я хотел бы взять существующий цвет фона элемента div и только отрегулировать непрозрачность ... как бы я это сделал?

---

Нашел очень простое решение моей проблемы; требует jquery-color плагина, но это, безусловно, лучшим решением, на моем взгляде:

$('#div').css('backgroundColor', $.Color({ alpha: value })); 

Answer 1

Непрозрачности сложна, потому что до сих пор нет кросса-браузера, поддерживаемого механизм, хотя его должен быть в CSS3.

Что вы, скорее всего, захотите сделать, это изменить альфа-канал стиля background-color. См: http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/

---

Кто разработал плагин JQuery, который делает только то, что вы хотите: http://archive.plugins.jquery.com/project/backOpacity

С помощью этого плагина, вы можете контролировать только «назад непрозрачности», не затрагивая дочерние элементы.

Answer 2

Загрузите фоновое изображение или цвет в Photoshop и уменьшите opaity там и сохраните его как .jpeg-образ, а затем используйте его в качестве фона в HTML.

Простой как это ....: D

Answer 3

query-color плагин является хорошим решением, однако я твердо верю, вы не нужно перегрузить приложение лишними плагинами для такой простой и простой задача.

Вот другой подход, использующий строки:

var alpha = "0.8"; 

var oldBGColor = $('#div').css('backgroundColor'); 
// rgb(40,40,40) 

var newBGColor = oldBGColor.replace('rgb','rgba').replace(')', ','+alpha+')'); 
// rgba(40,40,40,.8) 

$('#div').css('backgroundColor', newBGColor); 

Вот это jsFiddle пример того, как использовать его.

У меня был similar problem, и он сделал магию для меня.

Answer 4

, если вы хотите, чтобы перейти от непрозрачности x.xxx 1 вы можете сделать

var element = $("#id") 
element.css('backgroundColor', element.css('backgroundColor').replace(/(\d\.?\d*)\s*\)/i, "1")) 

сделать обратное просто изменить 1 по значению вы хотите.

Обратите внимание цвет нужно иметь "RGBA (100, 100, 100, 0,85098)" формат с самого начала