I need to display a progress bar.
This is the code written:
--end of code--
When i run the above script it works properly in chrome by displaying a progress bar showing percentage of issues completed as green while the rest of the bar is displayed as grey for not completed. But when i check this in IE, the progress bar is displayed as green and the grey colour is not to be seen. How to fix this?
This is the code written:
Code:
<div style="height:200px; overflow-y: scroll;"> <table id="tableid" class="aui"> <thead> <script>
function load()
{
document.getElementById('myprogress').style.width=$countDetails + "%";
}
</script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script type="text/javascript">
$(document).ready(function()
{
// Tooltip only Text
$('.prog-wrap').hover(function()
{
// Hover over code
var title = $(this).attr('title');
$(this).data('tipText', title).removeAttr('title');
$('<p class="tooltip"></p>')
.text(title)
.appendTo('body')
.fadeIn('slow');
}, function() {
// Hover out code
$(this).attr('title', $(this).data('tipText'));
$('.tooltip').remove();
}).mousemove(function(e) {
var mousex = e.pageX + 10; //Get X coordinates
var mousey = e.pageY + 10; //Get Y coordinates
$('.tooltip')
.css({ top: mousey, left: mousex })
});
});
</script> <style type="text/css" media="screen">
div.tooltip {
position: absolute; /*leave this and next 3 values alone*/
z-index: 1000;
left: -1000px;
top: -1000px;
background-color:#333427;
border: 10px solid black;
color: white;
padding: 3px;
width: 250px; /*width of tooltip*/
}
</style> <style type="text/css">
.progwrap
{
position: relative;
}
.progwrap, .progvalue
{
/* The width and height of your image */
background-color: #CCCCFF;
width: 300px; height: 10px;
}
</style> </thead> <body onload="load()"> </table>
*
<p><b>Estimate Completion:* $countDetails% complete</b></p> <div class="progwrap" title=$tooltipmsg> <div id="myprogress" class="progvalue" style="background-color: #009933;" > </div> </div>
When i run the above script it works properly in chrome by displaying a progress bar showing percentage of issues completed as green while the rest of the bar is displayed as grey for not completed. But when i check this in IE, the progress bar is displayed as green and the grey colour is not to be seen. How to fix this?