我有很多视频缩略图,当有人点击缩略图时,我试图在缩略图上方显示原始视频播放器。我正在使用 jwplayer,我想在单击缩略图时显示原始视频。通过为 div 提供视频 url 并使 jwplayer 可见并将其调整为 100%。
当有人单击按钮时,我希望播放器以 0% 的宽度和高度隐藏(以防止缩略图上的边距或空白。)通过单击不同的缩略图,视频 URL 会更改并隐藏或显示。此代码不起作用。有人有什么主意吗?
我已经定义了所有的 div。
这是Jquery
$(document).ready(function() {
$(".popup_link2").click(function(e) {
e.preventDefault();
$("#video").html( jwplayer('video').attr('file', $(this).attr("href")) );
jwplayer("video").resize('100%', '400');
});
});
$(document).ready(function() {
$(".btn").click(function() {
jwplayer("video").resize('0', '0');
});
});
这是jwplayer。和分区。
<div class="thumball">
<% @project.assets.each do |asset1| %>
<% if asset1.video.file? %>
<li class="thumbnail span1 col-md-2" id="thumb2" style="border: none; float: none; display: inline-block !important; float: none !important; position: relative;">
<%= link_to asset1.video.url(:orginal), class: :popup_link2, target: :_blank do %>
<div class="picture1">
<span class="roll" ></span>
</div>
<% end %>
<% end %>
<script type="text/javascript">
jwplayer("video").setup({
flashplayer: "<%=asset_path('jwplayer.flash.swf')%>",
file: '<%= asset1.video.url(:original) %>',
primary: "flash",
height: 0,
width: 0,
analytics: {
enabled: false,
cookies: false
}
});
</script>
<% end %>
</li>
</div>