如何使用 javascript 移除 tile(metro ui css) 的缩放效果
How to remove zoom effect of tile(metro ui css) using javascript
我创建了一个 tile(metro ui css) 并且该 tile 执行以下操作:
- 点击视频播放。
- 右滑效果不显示(点击)
我无法删除 tile.I 的缩放效果已尝试删除瓷砖 class,但它不是 working.Please 帮我删除瓷砖后的缩放效果 clicked.Here 是代码。
HTML
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="tile" id="vii">
<div class="tile-content slide-right" >
<div class="slide slide1">
<video id="myvideo" controls muted>
<source src="1.mp4" type="video/mp4" />
</video>
</div>
<div class="slide-over slide-over1" id="viii">
Attack by Smit
</div>
</div>
</div>
</div>
</div>
</div>
JavaScript
var myvideo = document.getElementById("myvideo");
var myaudio = document.getElementById("myaudio");
document.getElementById("vii").onclick=function(){
myvideo.play();
myvideo.style.display="block";
myvideo.style.width="600px";
myvideo.style.height="300px";
document.getElementById("viii").style.display="none";
}
这是代码片段:
http://jsbin.com/tujakasuci/1/edit?html,output
谢谢!!
您应该 OnClick,删除 slide-right
Class。缩放效果来自这个class:
document.getElementById("vii").onclick=function(){
$('.tile-content').removeClass("slide-right");
myvideo.play();
myvideo.style.display="block";
myvideo.style.width="600px";
myvideo.style.height="300px";
document.getElementById("viii").style.display="none";
}
我创建了一个 tile(metro ui css) 并且该 tile 执行以下操作:
- 点击视频播放。
- 右滑效果不显示(点击)
我无法删除 tile.I 的缩放效果已尝试删除瓷砖 class,但它不是 working.Please 帮我删除瓷砖后的缩放效果 clicked.Here 是代码。
HTML
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="tile" id="vii">
<div class="tile-content slide-right" >
<div class="slide slide1">
<video id="myvideo" controls muted>
<source src="1.mp4" type="video/mp4" />
</video>
</div>
<div class="slide-over slide-over1" id="viii">
Attack by Smit
</div>
</div>
</div>
</div>
</div>
</div>
JavaScript
var myvideo = document.getElementById("myvideo");
var myaudio = document.getElementById("myaudio");
document.getElementById("vii").onclick=function(){
myvideo.play();
myvideo.style.display="block";
myvideo.style.width="600px";
myvideo.style.height="300px";
document.getElementById("viii").style.display="none";
}
这是代码片段:
http://jsbin.com/tujakasuci/1/edit?html,output
谢谢!!
您应该 OnClick,删除 slide-right
Class。缩放效果来自这个class:
document.getElementById("vii").onclick=function(){
$('.tile-content').removeClass("slide-right");
myvideo.play();
myvideo.style.display="block";
myvideo.style.width="600px";
myvideo.style.height="300px";
document.getElementById("viii").style.display="none";
}