JQuery Youtube嵌入點擊CSS

當onclick iframe時，我想改變一個元素的CSS，所以當播放視頻的CSS會改變，當暫停視頻的CSS將返回。我知道JQuery，我試圖做到這一點，但沒有奏效。JQuery Youtube嵌入點擊CSS

下面的代碼：

$(".video-post").on("click", function() { 
    $(".video-post ELEMENT").css("display", "none"); 
});

HTML：

<div class="post-media video-post embed-responsive embed-responsive-16by9"> 
    <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/A5mM6VOVMk4" allowfullscreen></iframe> 
    <time datetime="2017">July 21, 2017</time> 
</div>

來源

2017-08-18 Çağrı Özarpacı

你試過$ this.css（「display」，「none」）;或$（this）.hide（）; –

不工作，我想設置過渡。 –

$(".video-post").click(function() { 
    $(this).hide(); 
});

來源

2017-08-18 14:10:50

它和我一樣。 –

發佈的HTML，所以我們可以協助。如果iframe的課程「視頻 - 帖子」比我寫的會起作用。 –

請張貼檢查。 –

我想你應該創建一個新的類來表示播放狀態。

在CSS中，您可以添加：

.video-playing{ 
    display:none; 
} 
.video-paused{ 
    display:inline; 
}

您可以使用jQuery方法.hasClass（），看看是否類的元素存在。你可以嘗試下面的代碼：

$(".video-post").click(function(){ 
    if($(".video-post ELEMENT").hasClass()){ 
    $(".video-post ELEMENT").removeClass("video-playing").addClass(".video-paused"); 
    }else{ 
    $(".video-post ELEMENT").removeClass(".video-paused").addClass("video-playing"); 
    } 
});

希望這可以幫到你。

來源

2017-08-18 14:37:58

它不工作其關於youtube api我有點搜索它的abot youtube API，但仍然我couldnt。 –

JQuery Youtube嵌入點擊CSS

回答

相關問題