играть звук с текстом Fadein - PullRequest
Новая
       35

играть звук с текстом Fadein

0 голосов
/ 03 мая 2011

Каков наилучший способ воспроизведения короткого звонка каждый раз, когда исчезают тексты в моем коде ниже?

Я читал, что jplayer, возможно, лучший вариант?

Я пробовал jquery.sound, но в Firefox окно «Плагин установки» отображается бесконечно, если Quicktime не установлен. 

$(function(){
  $(window).mousemove(function(){
    runIt();
  });
  runIt();      
})

function runIt() {
  var it = $('#myText');
  it.stop(true,true).clearQueue().fadeOut(1).animate({left:0},500).queue(function(){
    it.html('Start Again');
    it.dequeue();
  })
  it.fadeIn(500).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 1');
    it.dequeue();
  })
  it.fadeIn(1000).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 2');
    it.dequeue();
  })
  it.fadeIn(1000).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 3');
    $(window).unbind('mousemove');
    it.dequeue();
  })
  it.fadeIn(1000);
}

1 Ответ

1 голос
/ 03 мая 2011

Добро пожаловать в переполнение стека!

Ну, для начала;этот код выглядит действительно неэффективным.Не совсем уверен, что вы делаете с этим, так как это было вырвано из контекста, поэтому было бы неплохо, если бы вы могли показать нам немного больше.

В любом случае, чтобы попытаться ответить на ваш вопрос, HTML5 имеет встроенная поддержка воспроизведения аудио , но, может быть, вам нужно решение, более подходящее для разных браузеров?

С HTML5 вам нужно только сделать следующее: 

var sample = new Audio("file.mp3");
sample.play();

Лично я бы не сталперейдите к любому другому решению и оставьте его в покое, если браузер не поддерживает аудио HTML5.

Редактировать: Я прочитал код чуть ближе и понял, что вы очищаете / останавливаете очередь в некоторых местах.Не уверен в том, чтобы запускать его при каждом маленьком движении мыши, хотя:)

Редактировать 2: Я позволил себе немного поиграться с вашим кодом и jPlayer (который использует звук HTML5, если это возможно) и закончил сэто: 

$(function() {

    var element = $('#myText'),
        jPlayer = $("#jPlayer").jPlayer({
            ready: function() {
                $(this).jPlayer("setMedia", {
                    wav: "http://www.ibiblio.org/pub/multimedia/pc-sounds/ding.wav"
                });
            },
            supplied: "wav"
        });

    function jPlay() {   
        jPlayer.jPlayer("stop").jPlayer("playHead", 0).jPlayer("play");
    }

    function runIt() {
        element
            .stop(true, true)
            .clearQueue()
            .fadeOut(1)
            .animate({
                left: 0
            }, 500)
            .queue(function() {
                jPlay();
                element
                    .html('Start Again')
                    .dequeue();
            })
            .fadeIn(500)
            .animate({
                left: 0
            }, 5000)
            .fadeOut(1000)
            .queue(function() {
                jPlay();
                element
                    .html('test 1')
                    .dequeue();
            })
            .fadeIn(1000)
            .animate({
                left: 0
            }, 5000)
            .fadeOut(1000).queue(function() {
                jPlay();
                element
                    .html('test 2')
                    .dequeue();
            })
            .fadeIn(1000)
            .animate({
                left: 0
            }, 5000)
            .fadeOut(1000)
            .queue(function() {
                jPlay();
                $(window).unbind('mousemove');
                element
                    .html('test 3')
                    .dequeue();
            })
            .fadeIn(1000);
    }
    $(window).mousemove(function() {
        //runIt();
    });
    runIt();
});

Вы можете попробовать это на jsFiddle

...