javascript - jQuery - FadeToggle - 如果元素可见或不可见则执行不同的操作

Question

我有一个按钮，当您单击该按钮时，我正在执行 fadeToggle() 以显示或隐藏弹出窗口。

该弹出窗口出现在自动播放的 Flash 视频之上。

所以，我想做的是，当弹出窗口可见时，我想暂停视频。当它隐藏时，播放视频。

我的视频播放器已经支持这些功能。所以这工作正常:

 videoPlayer.pause(); 
 videoPlayer.play()

那么我的 FadeToggle() 会是什么样子？现在我有这段代码:

  $("#categorySlider").fadeToggle('fast', function() {
       var videoPlayer = document.getElementById("videoContainer");
       videoPlayer.pause();
  });

我在这里遗漏了 play() 部分，但我想不出添加它的语法？!如果 fadeToggle 不适合使用，任何 jquery 或 javascript 都可以!

有什么帮助吗？

Answer 1

您可以使用 jquery :visible 选择器来确定 #categorySlider 是否可见，并取决于暂停或播放视频。

$("#categorySlider").fadeToggle('fast', function() {
   var videoPlayer = document.getElementById("videoContainer");
   if ($("#categorySlider").is(":visible"))
        videoPlayer.pause();
   else
        videoPlayer.play(); 
});