单击播放列表时显示媒体播放器
问题描述:
当前正在尝试让播放器仅在播放列表中的某个项目单击时显示在屏幕底部。我写了这段代码:单击播放列表时显示媒体播放器
$(document).on("click", function(e){
if($(e.target).is(".playlistItem")){
$(".playerHolder").show();
}else{
$(".playerHolder").hide();
}
});
我目前有playerHolder设置为显示:无。但我希望它切换到显示:单击playlistItem时弹性。有任何想法吗?
答
您可以切换显示/隐藏类或有两个单独的类。你也可以添加内联样式,但我相信交换类是'更好'的。
CSS
.playerHolder-hidden {
display: none;
}
.playerHolder-show {
display: flex;
}
jQuery的
$(document).on("click", function(e){
if($(e.target).is(".playlistItem")){
$(".playerHolder").addClass("playerHolder-show").removeClass("playerHolder-hidden");
}else{
$(".playerHolder").addClass("playerHolder-hidden").removeClass("playerHolder-show");
}
编辑:
更新的jQuery从评论
$(document).on("click", function(e){
if($(e.target).is(".playlistItem")){
$(".playerHolder").addClass("playerHolder-show").removeClass("playerHolder-hidden");
}
感谢您的迅速反应!它可以工作,但如果您点击页面上的其他任何位置,玩家就会消失。 –
哦,那你不想要'别的'。删除前面括号之后的所有内容。 – Luke