0

3 つのボタンがあり、マウスがこれらのボタンの 1 つに近づくと、ランダムな音が再生されます。

var audio_1 = new Audio("1.mp3");
var audio_2 = new Audio("2.mp3");
var audio_3 = new Audio("3.mp3");

var array_son_video = new Array(audio_1, audio_2, audio_3);

マウスが要素に近づいたときに再生する関数:

$('body').mousemove(function(e){
    $('#mouse_position').html("mouse position: x=" + e.pageX + "; y=" + e.pageY);
    if (e.pageX > 300 && e.pageX < 400) {
        var random_number = Math.floor ( Math.random() * 2 );
        son_bt_video_1 = array_son_video[random_number];
        son_bt_video_1.play();
        $("#son_bt_video_1").text('son random : '+random_number);
    }
});

この部分は機能しますが、きれいではありません:

1) マウスが動くたびに乱数が生成されます。サウンドが終了したら、1 つだけ生成する必要があります。2) また、一時停止されているかどうかを確認するために、サウンドを追跡する必要があります。

if (son_bt_video_1.paused) {
    // generate a new sound
}

このような ：

if (e.pageX > 300 && e.pageX < 400) {
    if (son_bt_video_1.paused) {
        var random_number = Math.floor ( Math.random() * 2 );
        son_bt_video_1 = array_son_video[random_number];
        son_bt_video_1.play();
        $("#son_bt_video_1").text('son random : '+random_number);
    }
}

サウンドはランダムに生成されるため、それらを追跡する方法がわかりません。アドバイスいただけますか？

編集 ：

ユーザーは制御できません (再生ボタンと一時停止ボタンはありません)。マウスがボタンに近づくと、単純にサウンドが再生されます。再生が終了すると、マウスがボタンに近づくと、ユーザーは再び再生できます。

このコードはランダムなしで動作します:

$('body').mousemove(function(e){
    if (e.pageX > 300 && e.pageX < 485) {               
    son_bt_video_1 = array_son_video[0];
    son_bt_video_1.play();
    }
});
4

1 に答える 1

1

セバスチャン、

使用したことはありませんnew Audio()が、HTML5 要素と同じように機能すると仮定すると<audio>、次の行に沿ったものが機能するはずです。

var tracks = [
    new Audio("1.mp3"),
    new Audio("2.mp3"),
    new Audio("3.mp3")
];
tracks.current = null;

$('body').mousemove(function(e){
    if(!tracks.current || tracks.current.ended) {
        $('#mouse_position').html("mouse position: x=" + e.pageX + "; y=" + e.pageY);
        if (e.pageX > 300 && e.pageX < 400) {
            var random_number = Math.min(tracks.length-1, Math.floor ( Math.random() * tracks.length ));
            tracks.current = tracks[random_number];
            tracks.current.play();
            $("#son_bt_video_1").text(['son random : (' , random_number, ') ', tracks.current.src].join(''));
        }
    }
});
于 2013-01-24T21:17:53.233 に答える