动态更新页面bug

我在页面底部写了一个播放器，用js动态的更新进度和剩余播放时间。通过log可以看到js确实更新了进度和时间，但是页面上的展示的时间和进度一直不动，除非用手不停的拖动页面才显示。
还有个就是，我发现去掉播放先css里面bottom:0;这个就可以动态更新了，不过这样播放器就不是固定到底部了。
代码
html:

<div class="mui-content ">  
            <!--播放器-->  
            <div id="playerControl" class="playerContainer ">  
                <div class="playBtn" style="padding: 10px;">  
                    <img id="PlayButton" class="" src="../images/player/pause.png" style="height: 100%;" />  
                </div>  
                <div class="progressBackground">  
                    <div id="Progress"></div>  
                </div>  
                <div id="UnplayTime">0:00</div>  
            </div>  
</div>

csss:

/*player*/  
.playerContainer{ padding-left:1px;background-color: #00697F; height: 50px; position: fixed;  bottom: 0;  width: 100%; display: none;}  
.playBtn{float: left; height: 50px;}  
.progressBackground{margin: 20px 0px; width: 70%; height: 10px; float: left; background: #4CBED8;}  
#Progress{ background: #C0F4FF; height: 10px;}  
#UnplayTime{float：right; margin: 16px 0px; text-align: center; color: #C2F3FF; }

js:

/*播放器*/  
            var player = null;  
            var playerControl = document.getElementById("playerControl");  
            var duration = 0;  
            var postion = 0;  
            var time = "";  
            var timeInterval = null;  
            var playButton = document.getElementById("PlayButton");  

            function play(audiourl) {  
                    initPlayer();  
                    player = plus.audio.createPlayer(audiourl);  
                    startPlay();  
                }  
                //初始化播放器  

            function initPlayer() {  
                    if (timeInterval != null) {  
                        clearInterval(timeInterval);  
                    }  
                    if (player != null) {  
                        player.stop();  
                    }  
                    document.getElementById("Progress").style.width = "0%";  
                    document.getElementById("UnplayTime").innerText = "0:00";  
                    playButton.className = "play";  
                }  
                //退出页面销毁播放器  

            function destroyPlayer() {  
                console.log("destroyPlayer");  
                if (player != null) {  
                    player.stop();  
                    player = null;  
                }  
                if (timeInterval != null) {  
                    clearInterval(timeInterval);  
                    timeInterval = null;  
                }  
                mui(".playing").each(function(index, item) {  
                    item.src = "../images/3/music_but@3x.png";  
                    item.className = "audio_url";  
                });  
                playerControl.style.display = "none";  
                playButton.className = "";  
            }  

            function playerProgress() {  
                    duration = player.getDuration();  
                    postion = player.getPosition();  
                    var precent = Math.floor((postion * 100) / duration);  
                    document.getElementById("UnplayTime").innerText = getTime(duration - postion);  
                    document.getElementById("Progress").style.width = precent + "%";  
                    playerControl.style.bottom = "0";  
                    playerControl.style.zIndex = 100;  
                }  
                //开始播放  

            function startPlay() {  
                    document.getElementById("PlayButton").src = "../images/player/pause.png";  
                    playerControl.style.display = "block";  
                    timeInterval = setInterval(playerProgress, 1000);  
                    player.play(playFinish, function(e) {  
                        alert("Audio play failed: " + e.message);  
                        destroyPlayer();  
                    });  
                }  
                //播放完毕  

            function playFinish() {  
                destroyPlayer();  
            }