lundi 7 août 2017

JavaScript - if/else statement to display/hide image

Trying to code a specific function for Funbits HTML5 telemetry dashboard for Eurotruck simulator 2. The function should go like: <> an integer value for a variable provided by a coremodule is larger than 0 <> an image should be displayed <> it should remain hidden. The Coremodule is constructed so if I in my *.JS file write: data.truck.retarderBrake (which is an integer) Then the coremodule will return the current integervalue.

So my "pseudo code" will look something like this:

if (data.truck.retarderBrake>0) {
    show.image ('images/RetarderON.png');
    } else {
    hide.image ('images/RetarderON.png');
}

In my html code I have a statement for the image:

    <div class="RetarderOn"></div>

and the CSS looks like this:

.RetarderOn {
  background-image: url("images/RetarderON.png");
  position: absolute;
  left: 851px;
  top: 13px;
  width: 92px;
  height: 71px;
  visibility: hidden;
}

Can I do it this way ? - and what would the correct syntax for the JS if statement be. Maybe I can define all the properties of the image in the JS file instead of the CSS file??

As you can tell I have no coding background - so any help would be appeciated.

Aucun commentaire:

Enregistrer un commentaire