单击时如何删除不透明度(悬停不透明度),以便视频不透明

时间:2016-09-22 15:58:13

标签: jquery html css youtube opacity

我希望能够将鼠标悬停在YouTube视频上并影响透明度/不透明度(就像现在一样)但是,当我点击播放视频时,它会变为稳定,不再使用悬停不透明度。

我不确定如何在click上使用jQuery和iframe函数。它似乎不起作用。

* {
  margin: 0px 0 0 0;
}
body {
  background: url("https://photos-4.dropbox.com/t/2/AAAzaQaQL59efVSi-nMxk-jzk3dedLDcqaHBtj9zHmBZ2g/12/20139880/jpeg/32x32/1/_/1/2/back.jpg/EJ6Giw8Y9DUgBygH/bwJw1OSYLtn5ScrUolS8x1brd_phrJ_y11sS9ctVrzQ?size_mode=5") fixed;
  background-size: cover;
}
#content {
  width: 853px;
  height: 480PX;
  background: #000000;
  opacity: 0.8;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}
iframe {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -moz-transition: all 0.4s ease-out;
  /* FF4+ */
  -o-transition: all 0.4s ease-out;
  /* Opera 10.5+ */
  -webkit-transition: all 0.4s ease-out;
  /* Saf3.2+, Chrome */
  -ms-transition: all 0.4s ease-out;
  /* IE10? */
  transition: all 0.4s ease-out;
}
iframe:hover {
  opacity: 1.0;
  filter: alpha(opacity=100);
  -moz-transition: all 0.4s ease-out;
  /* FF4+ */
  -o-transition: all 0.4s ease-out;
  /* Opera 10.5+ */
  -webkit-transition: all 0.4s ease-out;
  /* Saf3.2+, Chrome */
  -ms-transition: all 0.4s ease-out;
  /* IE10? */
  transition: all 0.4s ease-out;
}
#logo {
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.6;
  width: 600px;
  height: auto;
}
#logo img {
  width: 600px;
  height: auto;
}
<div id="logo">
  <img src="http://s277461962.websitehome.co.uk/codepen/logo.png" />
</div>
<div id="content">
  <iframe width="853" height="480" src="https://www.youtube.com/embed/grsCRQaY2CI?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
</div>

CodePen:http://codepen.io/Middi/pen/PGbNgg

1 个答案:

答案 0 :(得分:0)

添加和删除类可能是一个不错的选择......

试试这个:

 public boolean keyUp(int keycode) {
        if (keycode == Input.Keys.A &&  player.b2body.getLinearVelocity().x >=-0.5) {
            SpinDashleft();


            return true;
        }
        else   if (keycode == Input.Keys.A &&  player.b2body.getLinearVelocity().x <=0.5) {
            SpinDashright();


            return true;
        }


        return false;
    }
   public void SpinDashleft() {


    player.b2body.applyLinearImpulse(new Vector2(-7.1f, 0), player.b2body.getWorldCenter(),true);

}

public void SpinDashright() {


        player.b2body.applyLinearImpulse(new Vector2(7.00f, 0), player.b2body.getWorldCenter(),true);

}