8 
//  Repaints the progress bar's filled-in amount based on the % of time elapsed for current video.
progressBar.change(function () {
    var currentTime = $(this).val();
    var totalTime = parseInt($(this).prop('max'), 10);

    //  Don't divide by 0.
    var fill = totalTime !== 0 ? currentTime / totalTime : 0;

    //  EDIT: Added this check, testing with it now.
    if (fill < 0 || fill > 1) throw "Wow this really should not have been " + fill;

    var backgroundImage = '-webkit-gradient(linear,left top, right top, from(#ccc), color-stop(' + fill + ',#ccc), color-stop(' + fill + ',rgba(0,0,0,0)), to(rgba(0,0,0,0)))';
    $(this).css('background-image', backgroundImage);
});

上記のJavaScriptを使用して、背景画像をグラデーションで変更し、進行状況バーを時間の経過とともに埋めています。

非常に断続的に -- 背景画像のレンダリングが完全に停止します。このコード全体にログを配置しましたが、すべてが適切に起動しているようです。0 で割っていないし、塗りつぶしも 0 ではありませんが、背景画像が表示されなくなります。

dom 要素をリロードすると、再び機能し始めます。だから、私はここで何か本当に間違ったことをしているだけなのだろうかと思っています。たぶん、何時間も連続して背景画像を設定することはできませんか？

編集:問題を強調するために、ログを記録した短いビデオクリップを取得しようとしています。再現するのに少し時間がかかるかもしれません。

  • コードにブレークポイントを設定すると、fill の値が 0 より大きく 1 より小さい値であることがわかりました。この例では、その値は 0.6925 でした。

  • コードにブレークポイントを配置し、そのポイントで中断してから実行を続行できるようにすると、プログレス バーの塗りつぶしが再表示されます。

EDIT2:これが起こっているビデオです: http://screencast.com/t/DvzBr06f

4

4 に答える 4

0

制限はありません。どのブラウザを使用していますか? ブラウザのキャッシュに問題がある可能性があるため、画像をあまり変更しないようにしてください。これは私がまとめたテストであり、FIDDLEとコードで正常に動作します:

CSS:

div {
    height:25px;
}

HTML:

<div id="pg"></div>

JS:

var counter = 0,
    alpha = window.setInterval(function(){
        counter++;
        if(counter > 60){
            window.clearInterval(alpha);
        } else {
            progressBar("#pg", counter);
        }
    }, 500),
    progressBar = function (elem, val) {
        var fill = val / 60;
        var backgroundImage = '-webkit-gradient(linear,left top, right top, from(#ccc), color-stop(' + fill + ',#ccc), color-stop(' + fill + ',rgba(0,0,0,0)), to(rgba(0,0,0,0)))';
        $(elem).css('background-image', backgroundImage);
    };
于 2014-05-03T18:42:18.277 に答える
0

いいえ、私の知る限り、制限はありません。そして、それが実際に何かに影響を与えるとはまったく思いません。

于 2014-02-26T14:38:09.627 に答える