3

Buenas el día de ayer hice una pregunta a la cual me respondieron de manera exitosa, solamente que al momento de implementarla en mi proyecto, trabajo con plantillas personalizadas de Blogger quise agregar el código de JQuery y no me detecta la función.

$('.custom-play').click(function(){
$(this).hide();
$('#content_video').get(0).play();});

Hay manera de hacer esa porción de código a JavaScript puro?

10
  • ¿Cómo estás intentando agregar la librería de JQuery? Commented el 24 mar. 2018 a las 19:33
  • La estoy agregando de esta manera <script src="ajax.googleapis.com/ajax/libs/jquery/3.3.1/…>
    – JesusSnd_
    Commented el 24 mar. 2018 a las 19:36
  • El orden también es importante, ¿en que lugar la estás añadiendo? Tendría que estar antes de tus ficheros .js personalizados y antes de todas las librerías que dependan de JQuery para funcionar. Commented el 24 mar. 2018 a las 19:37
  • Están antes de empezar agregar el código js
    – JesusSnd_
    Commented el 24 mar. 2018 a las 19:40
  • ¿Y en la consola del navegador te da algún error? Commented el 24 mar. 2018 a las 19:40

1 respuesta 1

3

Lo ideal sería que resolvieras el problema con jQuery pero si quieres la alternativa con Javascript puro, aquí la tienes:

var play = document.getElementsByClassName("custom-play");
play[0].addEventListener("click", function() {
  console.log(this);
  this.style.display = 'none';
  document.getElementById("video").play();
});
.custom-play {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: url("../images/button-play.png") center center no-repeat;
}
<div id="freq-content">
  <video id="video" width="320" height="240" controls controlsList="nodownload">
    <source
      src="http://html5facil.com/demos/videos/big_buck_bunny.webm"
      type='video/webm; codecs="vp8, vorbis"'>
    <source
      src="http://html5facil.com/demos/videos/big_buck_bunny.mp4"
      type='video/mp4; codecs="avc1,mp4a"'>
    </video><br />
  <div class="custom-play"></div>
</div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.