So I'm having trouble trying to string together multiple if statements together. The reason I need them is to target specific elements within my code so that one doesn't affect the other. For example, right now I have three progress bars acting at once. Which is good! But they all reach 75% . I want it so that the progress bars can be set to different numbers from each other, instead of them both sharing the same effect. If that makes sense. I don't think an else statement works in this case though.
Javascript
$(document).ready(function(){
var five = '5%';
var twentyfive = '25%';
var fifty = '50%';
var seventyfive = '75%';
var onehundred = '100%';
document.getElementById("photoshop").innerHTML = seventyfive;
document.getElementById("css").innerHTML = fifty;
document.getElementById("javascript").innerHTML = five;
setTimeout(function(){
$(".label").each(function() {
if($(this).html()==seventyfive){
$(this).click();
}
})
},1000)
})
Here's my HTML if that helps any.
<input type="radio" class="radio" name="progress" value="five" id="five" checked>
<label for="five" class="label">5%</label>
<input type="radio" class="radio" name="progress" value="twentyfive" id="twentyfive">
<label for="twentyfive" class="label">25%</label>
<input type="radio" class="radio" name="progress" value="fifty" id="fifty">
<label for="fifty" class="label">50%</label>
<input type="radio" class="radio" name="progress" value="seventyfive" id="seventyfive">
<label for="seventyfive" class="label">75%</label>
<input type="radio" class="radio" name="progress" value="onehundred" id="onehundred">
<label for="onehundred" class="label">100%</label>
<div class="progress">
<div class="progress-title"><span>PHOTOSHOP</span></div>
<div class="progress-bar" id="photoshop" style="color:black;"></div>
<div class="progress-bar-percent">75%</div>
</div>
<div class="progress">
<div class="progress-title"><span>CSS</span></div>
<div class="progress-bar" id="css" style="color:black;"></div>
<div class="progress-bar-percent">50%</div>
</div>
<div class="progress">
<div class="progress-title"><span>JAVASCRIPT</span></div>
<div class="progress-bar" id="javascript" style="color:black;"></div>
<div class="progress-bar-percent">5%</div>
</div>
Aucun commentaire:
Enregistrer un commentaire