progress bar - ionic change progressBar bar color in javascript -
the code below not working in application
html:
<div class="progressbar"> <div class="progressbarindicator"> </div> </div> css:
.progressbar{background-color: #fff; height:20px;} .progressbarindicator{background-color: #000; height:20px;} javascript:
$('.progressbarindicator').css({"background-color" : "red"});
first check, whether jquery.min.js present or not.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> if yes, change script way.
<script> $(document).ready(function(){ $('.progressbarindicator').css("background-color","red"); }); </script> $('.progressbarindicator').css({"background-color" : "red"}); ^ ^ ^ remove replace comma remove for more info, check jquery css method - w3 schools & background css using jquery - web developer forum
my updated code. needful changes if required.
<html> <head></head> <body> <style> .progressbar{ width: 100%; height: 20px; background: #fff; border-radius: 2px; border: 1px solid rgba(199, 197, 197, 1); } .progressbarindicator{ height: 20px; background: #019f45; overflow: hidden; border-radius: 2px; } </style> <div class="progressbar"> <div class="progressbarindicator"> </div> </body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(document).ready(function(){ $('.progressbarindicator').css("background", "red"); }); </script> </html> 
Comments
Post a Comment