折叠下拉时如何让视频自动停止播放?

时间:2016-05-28 20:04:16

标签: html css video

我在下拉窗口中插入了一个视频。因此,当用户放下窗口时,可以播放视频。但是,当用户折叠下拉窗口而不需要点击“暂停”时,我希望视频自动停止播放。您可以在下方的下拉窗口中找到该视频的html和css代码。

视频的html:

 <div class="wrapper">
<div class="videng">Click here to watch video</div>
<input id="_1" type="checkbox"> 
<label class="drop" for="_1">Watch here </label>  
<div class="run">

<video width="660" height="410" scrolling="no" controls >
<source src="videos/speaking/l2_snow.mp4" />
</video>

</div>
</div>

这是CSS

.collapse{
cursor: pointer;
display: block;
background: #999;
}
.collapse + input{
display: none; 
}
.collapse + input + div{
display:none;
}
.collapse + input:checked + div{
display:block;
}

.wrapper {
border:1px solid #999;
padding: 2px;
width:100%;
 }

非常感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

在这种情况下,您必须使用一点 public string this[int countryId] { get { if(!_dictCountries.ContainsKey(countryId)) { throw new ArgumentOutOfRangeException("countryId"); } return _dictCountries[countryId].Name; } set { if(!_dictCountries.ContainsKey(countryId)) { throw new ArgumentOutOfRangeException("countryId"); } _dictCountries[countryId].Name = value; } } 暂停视频,因为HTML / CSS无法执行此操作。 以下是public class Countries { private readonly CountriesVar[] _countriesArr; public Countries() { _countriesArr = new []{ new CountriesVar() { CountryId = 1, Name = "China"}, new CountriesVar() { CountryId = 2, Name = "Mexico" }, new CountriesVar() { CountryId = 3, Name = "France" }, new CountriesVar() { CountryId = 4, Name = "Spain" }, new CountriesVar() { CountryId = 5, Name = "Italy" } }; } //this seems weird to me, //it makes more sense to me that this would return a Coutnry public string this[int countryId] { get { return _countriesArr[countryId-1].Name; } set { _countriesArr[countryId-1].Name = value; } } } Javascript标记之间的代码。当用户取消选中ID为&#34; _1&#34;的复选框时,它会暂停视频元素。

<script>