Question

在价值变量中积极倾听并将jqueryui-slider与jplayer voulme结合起来？还在另一个div中显示音量值？有没有办法获取jqueryui slider val的值并将其应用于jplayer vaolume的值？ html标记：

<ul class="toolbar ui-widget-header ui-corner-all">
                <li><button class="jp-play" href="#">Play</button></li>
                <li><button class="jp-pause" href="#">Pause</button></li>
                <li><button class="jp-stop" href="#">Stop</button></li>
                <li><button class="jp-mute" href="#">Mute</button></li>
                <li><button class="jp-unmute" href="#">Unmute</button></li>
                <li><div class="jp-volume-bar"></div></li>
            </ul>
            <ul>


            </ul>

jquery的：

my_jPlayer.jPlayer({
        ready: function () {
            $("#jp_container .track-default").click();
        },
        timeupdate: function(event) {
            my_extraPlayInfo.text(parseInt(event.jPlayer.status.currentPercentAbsolute, 10) + "%");
        },
        play: function(event) {
            my_playState.text(opt_text_playing);
        },
        pause: function(event) {
            my_playState.text(opt_text_selected);
        },
        ended: function(event) {
            my_playState.text(opt_text_selected);
        },
        swfPath: "js",
        cssSelectorAncestor: "#jp_container",
        supplied: "mp3",
        wmode: "window",
        volumeBarValue: volVal
    });
$(".jp-volume-bar").slider({
            value: 100,
            orientation: "horizontal",
            range: "min",
            animate: true
    });
    var volVal = $(".jp-volume-bar").slider("value");

Answer 1

使用最新的jplayer（版本：2.1.0）非常容易：

$('#sliderVolume').slider({
    value : 50,
    max: 100,
    range: 'min',
    animate: true,
    orientation: "vertical",

    slide: function(event, ui) {
        var volume = ui.value / 100;
        $("#jquery_jplayer").jPlayer("volume", volume);
    }
});

Answer 2

这应该可以通过事件来实现。如果您不熟悉这个概念，请查看jQuery事件绑定和事件触发。

知道了如何进行事件处理后，请查看jQuery滑块的幻灯片事件。 http://docs.jquery.com/UI/Slider#event-slide。

您只需更新jPlayer的音量并更改div中您想要音量的值

jqueryui slider + jplayer音量值

2 个答案: