Search code examples
sassextjs6.5

Dynamic variable in SCSS

Hello I want to set the url dynamic based on a variable found in my Application.js. Sof if the variable is true, the path to the url should be like: 

"https:/asite/resources/mybackground.jpg"

Otherwise it takes it directly from the resources folder of the application as such:

"/resources/mybackground.jpg"

So I need to append the variable in the url. The issue is that the variable is found in my Application.js file and not in another scss file.

How can I achieve this?

Please find my css code below:

.myviewport::after {
  background: url("/resources/mybackground.jpg") no-repeat;
  position: absolute;
  z-index: -1;
}
Solution

  • You can do it in jQuery :

    if(need_change) { 
    $('.myviewport').css('background', 'url("the other URL")') 
}

// else you keep the current background