user379468
user379468

Reputation: 4039

How do i set a dynamic gradient color using JQuery

I'm currently adding a class to a DIV in javascript using the following code

if(note !== 0) $el.addClass('seq-note');

and here is the css

.seq-ui .seq-row span.seq-note {
  background: #444 -webkit-linear-gradient(#7c8, transparent);
  background: #444 linear-gradient(#7c8, transparent);
  border-color: #565;
}

note is actually a hex value, so I want to change the gradient to that hax color. How would I re-factor this code so that the color is dynamic

Upvotes: 0

Views: 500

Answers (1)

Bemisawa
Bemisawa

Reputation: 246

Is there anything preventing you from using .css?

var bgColor;
bgColor = "#444 linear-gradient(#" + note + ")";
$('.seq-note').css("background", bgColor);

This will not update the CSS file - .css works by adding inline CSS to the DOM - so I believe any future divs to which you add this class will not have this property.

That does handle vendor prefixes since jQuery 1.8.0, as explained here: Does .css() automatically add vendor prefixes?

Upvotes: 1

Related Questions