title: Dynamically change JavaFX css property
body: <p>In my FXML I have a simple slider:</p>
  
  <pre><code>&lt;Slider fx:id="timeSlider" showTickLabels="true" GridPane.rowIndex="3" GridPane.columnIndex="0" GridPane.columnSpan="4"/&gt;
  </code></pre>
  
  <p>This slider is part of a desktop music application I am writing and it signifies how far into the song has been played.  I have written a change event that is called everytime the the song time is changed, and this successfully accomplishes sliding the knob/thumb down.</p>
  
  <p>Now I am trying to also to color the left part (already played) blue and the right part (yet to be played) white as the knob slides down.  If I hard code this line into my CSS i can accomplish fading from blue/white at the 50% mark.</p>
  
  <pre><code>.slider .track {-fx-background-color: linear-gradient(to right, #90C7E0 50%, white 50%);}
  </code></pre>
  
  <p>However,  I need this to be dynamic based on how far I am in the song.  I have written the following code, but can't seem to get the CSS style to apply</p>
  
  <pre><code>song.getMediaPlayer().currentTimeProperty().addListener(new ChangeListener&lt;Duration&gt;() {
          @Override
          public void changed(ObservableValue&lt;? extends Duration&gt; observable, Duration oldValue, Duration newValue) {
              if (newValue != null &amp;&amp; timeSlider != null) {
                  timeSlider.setValue(newValue.toSeconds());
                  double percentage = (newValue.toSeconds()/song.getDuration())*100;
                  String css = ".slider .track{-fx-background-color: linear-gradient(to right, #90C7E0 " +
                   percentage + "%, white " + percentage + "%);}";
                  timeSlider.getStyleClass().add(css);
              }
          }
      });
  </code></pre>
  
  <p>I believe it's something to do with how I am adding the CSS as a style, because even adding a simple non dynamic style does not work.  I get no errors so I am not sure what I am doing wrong.</p>
  
  <p>Any help is appreciated, and better ways to accomplish this are also appreciated.  Thanks!</p>