0

<audio>特定の html5 要素がホバーされるたびに特定の html5 要素を再生するスクリプトに取り組んでいます<div>。jQueryを使用してホバーを検出し、音量をアニメーション化してオーディオをフェードイン/フェードアウトします。

これが私のコードです：

<head>
<!--  unrelated code removed -->
<script type="text/javascript">
$(document).ready(function(){
    //unrelated code removed
    $("#pog").mouseenter(function() {
        $("#poga").get(0).volume=0;
        $("#poga").get(0).play();
        $("#poga").animate({volume: 1}, 1000);
    });
    $("#pog").mouseleave(function() {
        $("#poga").animate({volume: 0}, 1000, function() {
            $("#poga").get(0).pause();
        });
    });
});
</script>
</head>
<body>
    <audio preload loop controls id="poga">
        <source src="audio/phantogram.mp3"></source>
        <source src="audio/phantogram.ogg"></source>
        Your browser isn't invited for super fun audio time.
    </audio>
    <div id="pog" class="band">Phantogram</div>
</body>

ここに jsFiddle があります: http://jsfiddle.net/2eG6s/

問題は、ボリューム アニメーションが非常に途切れ途切れであることです。一定間隔でフェードインとフェードアウトします (正確な音量はわかりませんが、100%、60%、20% のようなものです)。これは本当に奇妙で、Windows 7 の Firefox 21.0 および 22.0 でのみ発生します (Firefox 21.0 および 22.0 の Mac バージョンは正常に動作します)。

ヘルプ！

4

1 に答える 1

1

これはかなり前に修正されたと思いました: https://bugzilla.mozilla.org/show_bug.cgi?id=487504

問題は、オーディオ バッファと、古いlibsydneyaudioバックエンドがどのように動作するかでした。バッファはボリュームが変更されたときにパージされなかったため、現在バッファリングされているオーディオの再生が終了した後にのみ、可聴の変更が発生しました。

どういうわけか、 https://bugzilla.mozilla.org/show_bug.cgi?id=852401cubebによると稼働中の新しいバックエンドはこれを修正しているはずですが、どうやらまだ問題があり、私にはまだ問題のように思えます。バッファリングの問題。

私はイベントでplay()メソッドを呼び出す回避策を使用しvolumechangeていましたが、これは途切れを少なくするのに役立ちましたが、今ではこれを行うときに違いはないようです.

したがって、この問題の解決策はありませんが (解決策があるとしても)、この情報は役立つかもしれないと考えました。

于 2013-07-01T19:23:37.530 に答える