Afternoon all, I'm writing a text based game in an effort to learn JavaScript, my current issue is with the user interface, I have displayed in both top corners of the screen the HitPoint values of the user and which ever mob you are currently battling, my issue is that the values do not update after the player or mob take a hit.
for example this is the code used to determine how much is hit;
if (input.indexOf("attack") > -1) { if (input == "attack"){ var userDmg = Math.floor(Math.random() * 100); var mobDmg = Math.floor(Math.random() * 80); $("#message_attack").html("You attack for: " + userDmg + " ---- Goblin HP left " + (mobHP -= userDmg)).clone().insertBefore("#placeholder").hide().fadeIn(3000); $("#message_attack").html("The Goblin attacks back for: " + mobDmg + " ---- Your HP left " + (userHP -= mobDmg)).delay(2000).insertBefore("#placeholder").hide().fadeIn(3000); } }
This is how I am displaying the HTML
<div id="mobhealthbar" class="auto-style3" style="width: 180px; position: absolute; right: 20px; top: 50px; height: 25px;"></div><script type="text/javascript">document.getElementById("mobhealthbar").innerHTML= "MOB HP: " + mobHP; </script><div id="userHealthBar" class="auto-style2" style="width: 180px; left: 21px; position: absolute; top: 60px; height: 25px;"><script type="text/javascript">document.getElementById("userHealthBar").innerHTML= "USER HP: " + userHP; </script></div>
any advice would be welcome