與jQuery UI的滑塊TubePlayer插件視頻當前時間同步

Question

只是一些資源，幫助幫我想想辦法:)

1. 缺乏與視頻當前時間只有UI滑塊同步全功能的控件播放器：http://jsfiddle.net/GR7Z2/45/
2. jQuery UI的滑塊文檔http://jqueryui.com/demos/slider/#option-value
3. tikku chromless播放器的插件文件http://www.tikku.com/jquery-youtube-tubeplayer-plugin#tubeplayer_tutorial_3

ŧ

var seektime = $("#youtube-player-container").tubeplayer("data").currentTime; 
       $("#slider").slider("option", "value", seektime); 

雖然我已經想通了如何尋求一個時間：我有與當前時間 我已經嘗試設置jQuery的滑塊值到當前的時間（秒），並保持同步，他的問題在使用滑塊視頻 的jQuery是很長，凌亂洙我建議觀看它的jsfiddle http://jsfiddle.net/GR7Z2/45/一個比較清晰的認識，但在這裏它是任何方式

$(".pause").hide(); 
$(".unmute").hide(); 
jQuery("#youtube-player-container").tubeplayer({ 
    width: 600, 
    height: 450, 
    showControls: 0, 
    allowFullScreen: "true", 
    modestbranding: false, 
    initialVideo: "Y70rcfQEK7U", 
    preferredQuality: "default", 
    onPlay: function(id){$(".play").hide();}, 
    onPause: function(){$(".pause").hide();$(".play").show();}, 
    onStop: function(){$(".pause").hide();$(".play").show();}, 
    onSeek: function(time){}, 
    onMute: function(){$(".mute").hide();$(".unmute").show();}, 
    onUnMute: function(){$(".unmute").hide();$(".mute").show();}, 
    onPlayerUnstarted: function(){}, 
    onPlayerPlaying: function(){$(".play").hide();$(".pause").show();}, 
    onPlayerBuffering: function(){$(".pause").show();} 
}); 
$(".play").click(function(){ 
    $("#youtube-player-container").tubeplayer("play"); 
}); 
$(".pause").click(function(){ 
    $("#youtube-player-container").tubeplayer("pause"); 
}); 
$(".stop").click(function(){ 
    $("#youtube-player-container").tubeplayer("stop"); 
}); 
$(".mute").click(function(){ 
    $("#youtube-player-container").tubeplayer("mute"); 
}); 
$(".unmute").click(function(){ 
    $("#youtube-player-container").tubeplayer("unmute"); 
}); 

     function getYouTubeInfo() { 
       $.ajax({ 
         url: "http://gdata.youtube.com/feeds/api/videos/Y70rcfQEK7U?v=2&alt=jsonc", 
         dataType: "json", 
         success: function (data) {parseresults(data)} 
       }); 
     } 

     function parseresults(result) { 
       console.log(result);  
       var vidlength = result.data.duration; 

       $('#vidlength').html(vidlength); 
      $(function() { 
     $("#slider").slider({ max: vidlength }); 
$("#slider").bind("slidechange", function(event, ui) { 
    var viseekto = $('#slider').slider('value'); 
    jQuery("#youtube-player-container") 
     .tubeplayer("seek", viseekto); 
}); 
    var seektime = $("#youtube-player-container").tubeplayer("data").currentTime; 
       $("#slider").slider("option", "value", seektime); 

    }); 
     } 
$(document).ready(function() { 
     getYouTubeInfo(); 
}); 

Answer 1

進出口尋找在完全相同的解決方案，當你建造這裏。

謝謝你的滑塊功能！

我已經這樣完成了劇本：

$("#slider").slider({ 
    max: $("#video").tubeplayer("data").duration, 
    stop: function(event, ui) { 
     var viseekto = $('#slider').slider('value'); 
     jQuery("#video").tubeplayer("seek", viseekto); 
    }, 
}); 
window.setInterval(function() { 
    var seektime = $("#video").tubeplayer("data").currentTime; 
    $("#slider").slider("option", "value", seektime); 
}, 1000); 

希望它能幫助！