このチュートリアルから取得したオン/オフ ボタンをjPlayer ページに実装しました。
- チュートリアルでわかるように、ボタンには押された状態と押されていない状態の 2 つの状態があります。
- 変更した Player の jquery ファイルを使用して、ページにボタンを実装しました。
index.htmlに実装しようとすると、押された状態に変わりますが再生されません。jQuery内に実装すると、押された状態に変わりませんが再生されます。
これは私のコードですmetroplayer.js
:
$(document).ready(function(){
$('#button').on('click', function(){
$(this).toggleClass('on');
});
});
(function($){
$.fn.extend({
metroPlayer: function(options) {
var defaults = {
}
var options = $.extend(defaults, options);
return this.each(function() {
obj = $(this);
o = options;
$template = $('<div id="metro-wrapper">'+
'<div id="metro-left-overlay"></div>'+
'<div id="jp_container_N" class="">'+
'<div id="jquery_jplayer_N" class="jp-jplayer"></div>'+
'<div class="jp-gui">'+
'<div class="jp-interface">'+
'<div id="metro-left">'+
'<div id="metro-controls">'+
'<ul>'+
//'<li id="metro-prev" class="jp-prev"><img src="img/prev.png" /></li>'+
'<section><a id="button" class="onoffbutton jp-play" href="#"></a>'+
'<span></span>'+
'</section>'+
「押された」モードでボタンが表示されないようにするコードの何が問題になっていますか?
これは私のプレーヤーページです。